layer 弹窗 加载层 选择框

一款非常好用的前端 弹出框/层，特别容易上手。
官网 : http://layer.layui.com

首先依赖jquery

1.alert

layer.alert("显示信息"); // 最基本的layer.alert("显示信息", {    icon: 0 , // 0~6    title: "标题", // 文字、 、false    closeBtn: 1 // 右上角关闭x 0:无 1:有 2:有(略丑)});layer.alert("显示信息", {    title: "标题"}, function (index) {    // 点击确定按钮，执行代码块，不会关闭当前提示    layer.close(index); // 关闭当前提示});

2.confirm

layer.confirm("请确认",{    title: false,    btn: ['确定','取消']},function(){    layer.alert("确定");},function(){    layer.alert("取消");});

3.信息框(最常用)

layer.msg("最常用的提示",{    title: false,    closeBtn: 0,    time: 3*1000, // 3秒后关闭    shadeClose: true, // 点击其他位置关闭    scrollbar: false // 锁定滚动条});var layerMsg = layer.msg("加载中", {    title: false,    icon: 16 // 加载图标});layer.close(layerMsg); // 关闭单个layer.closeAll(); // 关闭所有

4.页面层

layer.open({    type: 1,     content: '随意标签或者文本'});

5.加载层

var layerMsg = layer.load(1,{ // 此处1没有意义，随便写个东西    icon: 0, // 0~2 ,0比较好看    shade: [0.5,'black'] // 黑色透明度0.5背景});layer.close(layerMsg); // 关闭单个layer.closeAll(); // 关闭所有

常用属性

// 坐标 , y zoffset: ['100px', '50px']offset: '100px' // 设置垂直坐标，水平自适应offset: 't' // 顶部offset: 'r' // 靠右offset: 'b' // 底部offset: 'l' // 靠左offset: 'lt' // 左上offset: 'lb' // 左下offset: 'rt' // 右上offset: 'rb' // 右下// 宽高area: ['100px', '100px']area: '100px' // 定义宽度，高度自适应style: class // 定义一个样式