Layer 弹出层组件

一、Layer是什么？

用于实现网页中的各种弹出层交互，

如

Alert/Confirm/Message/Tips/Page/Iframe/Loading/Prompt/Tab/photo 应有尽有

因为原生的alert、confirm等太丑了，因此我们使用layer的弹出层

二、快速使用

1. 添加js和layer.js

 <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script><script src="/js/layer/layer.js"></script>

2.使用即可

2.1 alter

让弹窗变的好看

 layer.alert("不能选择删除0条数据！")

2.2 msg

layer.msg(ret.msg, function () {parent.close();parent.refresh();});

2.3 open

打开一个新的窗口

addorupdate:function (url,title) {index=  layer.open({type:2,//代表是iframetitle:title,  //标题content:url,  //不仅可以传入普通的html内容，还可以指定DOM，更可以随着type的不同而不同area:['990px', '500px'],//宽高closeBtn:1, //设置右上角的叉图标anim:2 ,//设置动画maxmin:true, //设置最大最小fixed:true})},

2.4 full

让窗口全屏显示

 index=  layer.open({type:2,//代表是iframetitle:title,  //标题content:url,  //不仅可以传入普通的html内容，还可以指定DOM，更可以随着type的不同而不同area:['990px', '500px'],//宽高closeBtn:1, //设置右上角的叉图标anim:2 ,//设置动画maxmin:true, //设置最大最小scrollbar:false,fixed:true})//实现全屏layer.full(index)

2.5 close

关闭

 function  close() {layer.close(index);}

Layer 弹出层组件相关推荐

layer弹出层组件实现加载效果
layer弹出层组件挺实用的,需要跟jQuery配合使用,下面介绍一下利用layer制作加载层. 使用layer.load() layer.load(1,{ // 0/1/2表示图标,load有三种可 ...
使用layer弹出层组件绑定页面按钮
绑定教程 $('#member_add').on('click', function(){layer.open({type: 2,title: '添加商品 ',maxmin: true, shadeC ...
layUI弹出层组件使用
首先官网下载layUI或者下载layer.js组件也可以 layer.js组件官网链接 layer 弹出层组件 - jQuery 弹出层插件 (layuiweb.com) 独立组件使用需要引入JQue ...
Vue（二十一）Layer弹出层
安装:下载源码到本地 layer: 丰富多样的 Web 弹出层组件,可轻松实现 Alert/Confirm/Prompt/普通提示/页面区块/iframe/tips 等等几乎所有的弹出交互.目前已成为 ...
弹出层组件-layui.layer
弹出层组件文档-layui.layer layer只是作为layui的一个弹层模板,由于layer可以独立使用,也可以通过layui模块化使用,所以请按照实际需求来选择. 作为独立组件使用,可以去la ...
html5相对父元素定位,layer弹出层设置相对父级元素定位
layer弹出层默认是相对body固定定位的,可是项目中一般需要相对某个盒子相对定位,下面是个加载弹层例子: var loadIndex = layer.open({ type: 3, //3 表示加 ...
layer弹出层扩展自定义样式
layer是一款近年来备受青睐的web弹层组件,她具备全方位的解决方案,致力于服务各水平段的开发人员,您的页面会轻松地拥有丰富友好的操作体验. 官网 http://layer.layui.com/ l ...
Layer——弹出层
Layer--弹出层开发工具与关键技术:Visual Studio 前端作者:盘子撰写时间:2019年5月16 日 Layui.layer弹层组件文档,layer是layui的代表作,也只是作为 ...
layui弹出层html,layer弹出层
layer 弹出层,怎么只让他弹出一次.在线等我昨天用这个插件的时候也有这个问题,弹出内容大了就居不了中.这是组件不完美的地方,他设置了top和left值,而且是固定的.这种弹出层都是绝对定位的所 ...

Layer 弹出层组件

Layer 弹出层组件

一、Layer是什么？

二、快速使用

1. 添加js和layer.js

2.使用即可

2.1 alter

2.2 msg

2.3 open

2.4 full

2.5 close

Layer 弹出层组件相关推荐

最新文章

热门文章