官方文档http://layer.layui.com/
https://cdn.bootcss.com/layer/2.3/layer.js
https://github.com/logoove/jqueryplus/blob/master/layer/layer.css不需要加载图片了,已经base64
layer.alert('内容');
layer.alert('内容', {
icon: 1//1蓝色对号 2红色错误 3橙色问号4灰色锁 5红色哭脸
})
layer.msg('玩命提示中');
0文本1密码2文本域
layer.prompt({title: '请输入', formType: 0}, function(text, index){
layer.msg(text);
});
//询问框
layer.confirm('您是如何看待前端开发?', {
btn: ['重要','奇葩'] //按钮
}, function(){
layer.msg('的确很重要', {icon: 1});
}, function(){
layer.msg('也可以这样', {
time: 20000, //20s后自动关闭
btn: ['明白了', '知道了']
});
});
//捕获页
layer.open({
type: 1,
shade: false,
title: false, //不显示标题
content: $('.layer_notice'), //捕获的元素,注意:最好该指定的元素要存放在body最外层,否则可能被其它的相对元素所影响
cancel: function(){
layer.msg('捕获就是从页面已经存在的元素上,包裹layer的结构', {time: 5000, icon:6});
}
});
//页面层
layer.open({
type: 1,
skin: 'layui-layer-rim', //加上边框
area: ['420px', '240px'], //宽高
content: 'html内容'
});
layer.tips('Hi,我是tips', '吸附元素选择器,如#id');
//相册层
$.getJSON('test/photos.json?v='+new Date, function(json){
layer.photos({
photos: json //格式见API文档手册页
,anim: 5 //0-6的选择,指定弹出图片动画类型,默认随机
});
});
//tab层
layer.tab({
area: ['600px', '300px'],
tab: [{
title: 'TAB1',
content: '内容1'
}, {
title: 'TAB2',
content: '内容2'
}, {
title: 'TAB3',
content: '内容3'
}]
});
点击小图看大图
$(document).on("click","img.big",function(e){
layer.photos({
photos: { "data": [{"src": e.target.src}] }
});
});
作者:Yoby 创建时间:2020-07-25 16:53
更新时间:2024-12-05 13:26
更新时间:2024-12-05 13:26