转 layer的Icon样式以及一些常用的layer窗口使用
转载地址:http://blog.csdn.net/beauxie/article/details/60959971
本文搜集的是本人在实际开发中所用到的layer窗口,未用到的layer按钮,请参考layer官网:http://layer.layui.com/
一、layer的icon样式
以上样式测试代码:
- layer.confirm('icon测试', {icon: 1, title:'提示'}, function(index){
- //do something
- alert("确认");
- layer.close(index);
- });
二、询问框
官方案例:
- //询问框
- layer.confirm('您是如何看待前端开发?', {
- btn: ['重要','奇葩'] //按钮
- }, function(){
- layer.msg('的确很重要', {icon: 1});
- }, function(){
- layer.msg('也可以这样', {
- time: 20000, //20s后自动关闭
- btn: ['明白了', '知道了']
- });
- });
本人所用到,需要修改标题,正如以上测试样式时的代码一样,实现自定义标题:
- var message = "确定继续?";
- //询问框
- layer.confirm(message, {icon: 3, title:'信息提示'}, function(index){
- //submitForm();
- layer.close(index);
- });
三、提示层
官方案例:
- //提示层
- layer.msg('玩命提示中');
默认关闭时间是3秒,效果如下(背景是官网的广告,实际效果是黑色半透明):
自定义样式以及时间,代码如下:
- layer.msg('操作成功!', {icon: 6, time: 2000});
icon样式是6,关闭时间为2秒。效果如下:
四、弹框(自定义页)
官方案例:
- //自定页
- layer.open({
- type: 1,
- skin: 'layui-layer-demo', //样式类名
- closeBtn: 0, //不显示关闭按钮
- anim: 2,
- shadeClose: true, //开启遮罩关闭
- content: '内容'
- });
效果如下:
本人使用案例,使用layer实现弹框登录:
- layer.open({
- type: 2,
- title: '用户登录',
- maxmin: true,
- skin: 'layui-layer-lan',
- shadeClose: true, //点击遮罩关闭层
- area : ['400px' , '280px'],
- content:'login.html'//弹框显示的url,对应的页面
- });
其中‘login.html’是登录页面,其效果如下:
弹框登录案例,请参考本人另外一篇博客:使用layer实现登录弹框,登录成功以后关闭弹框并调用父窗口方法
转 layer的Icon样式以及一些常用的layer窗口使用的更多相关文章
- layer icon样式及 一些弹框使用方法
一.layer的icon样式 以上样式测试代码: layer.confirm('icon测试', {icon: 1, title:'提示'}, function(index){ //do someth ...
- layer插件学习——icon样式
本文是自己整理的关于layer插件的icon样式结果 一.准备工作 下载jQuery插件和layer插件,并引入插件(注意:jQuery插件必须在layer插件之前引用) 百度云资源链接: jQuer ...
- CSS样式有哪些常用的属性?
一般的一个DIV的CSS设置属性有:margin,padding,width,height,font-size,text-align,background,float,border CSS样式有哪些常 ...
- 常用的layer弹出层
本文来自 松耦合 的CSDN 博客 ,全文地址请点击:https://blog.csdn.net/dunegao/article/details/78978448?utm_source=copy 常用 ...
- layer弹出层不居中解决方案,layer提示不屏幕居中解决方法,layer弹窗不居中解决方案
layer弹出层不居中解决方案,layer提示不屏幕居中解决方法,layer弹窗不居中解决方案 >>>>>>>>>>>>> ...
- layer.open参数;layer.open关闭事件;layer.open关闭刷新;layer.open获取子页的值;layer.open调用子页面的方法
父页面 function layerOpen() { layer.open({ type: 2, shade: [0], title: "验收申请", area: ['1024px ...
- PLSQL常用配置之窗口/版面保存、SQL格式化/美化、SQL注释\去掉注释等快捷键配置、登陆历史修改配置
http://blog.csdn.net/hyeidolon/article/details/8251791 PLSQL常用配置之窗口/版面保存.SQL格式化/美化.SQL注释\去掉注释等快捷键配 ...
- CSS样式表之常用文本属性
断更了两周了,因为纠结之后在学java啦,但是还是要把学过的前端知识更完 以下的一些文本属性是CSS最常用的属性: [长度单位]:px(像素) [颜色单位]: 十六进制:#ffffff 分别对应红绿蓝 ...
- javascript控制样式表(不常用)
<html> <head> <title>Example XHTML page</title> <link href="css1.css ...
随机推荐
- C# 安装WindowsService时弹出设置服务登录窗口的解决方案
使用SignalR实现消息推送,页面实时刷新,使用WindowsService作为SignalR的宿主,也就是作为一个消息服务器,在使用cmd命令安装的时候弹出设置服务登录的窗口,解决此问题的具体操作 ...
- Linux磁盘及文件系统管理3
文件系统管理工具: 创建文件系统的工具 mkfs mkfs.ext2,mkfs.ext3,mkfs.ext4,mkfs.xfs,mkfs.vfat,... 检测及修复文件系统的工具 fsck fsck ...
- Jmeter官方插件实现Dubbo接口测试
目前主流的分布式框架有Dubbo和SpringCloud, SpringCloud是基于Http协议的分布式框架,Dubbo是基于RPC的分布式框架,Jmeter没有内置对Dubbo接口的支持,很难直 ...
- YOLO---Darknet下的学习笔记
YOLO.V3-Darknet下的学习笔记 @wp20180927 [目录] 一. 安装Darknet(仅CPU下) 2 1.1在CPU下安装Darknet方式 2 1.2在GPU下安装Darknet ...
- css浮动(float)及如何清除浮动
前言: CSS浮动是现在网页布局中使用最频繁的效果之一,而浮动可以帮我们解决很多问题,那么就让我们一起来看一看如何使用浮动. 一.css浮动(float)(1)html文档流 自窗体自上而下分成一行一 ...
- 基于VS2013的MFC窗体按钮事件触发案例(亲测可用)
学过python的小朋友们一定对python freeze命令不陌生,这一命令用于导出python安装模块,用于新电脑可以快速的配置安装所需的模块,以便快速的加入项目. 那么我们大可以用 window ...
- CF311B Cats Transport(斜率优化)
题目描述 Zxr960115 是一个大农场主.他养了m只可爱的猫子,雇佣了p个铲屎官.这里有一条又直又长的道路穿过了农场,有n个山丘坐落在道路周围,编号自左往右从1到n.山丘i与山丘i-1的距离是Di ...
- 牛客练习赛3 贝伦卡斯泰露——队列&&爆搜
题目 链接 题意:给出一个长度为 $n$ 的数列 $A_i$,问是否能将这个数列分解为两个长度为n/2的子序列,满足: 两个子序列不互相重叠(是值不能有共同元素,但位置可以交错). 两个子序列中的数要 ...
- 洛谷P1140 相似基因【线性dp】
题目:https://www.luogu.org/problemnew/show/P1140 题意: 给定两串基因串(只包含ATCG),在其中插入任意个‘-’使得他们匹配.(所以一共是5种字符) 这5 ...
- Codeforces Round #590 (Div. 3) C. Pipes
链接: https://codeforces.com/contest/1234/problem/C 题意: You are given a system of pipes. It consists o ...