前言

Layer一个让你想到即可做到的Web弹窗/层的解决方案，layer是一款近年来备受青睐的web弹层组件，她具备全方位的解决方案，致力于服务各水平段的开发人员，您的页面会轻松地拥有丰富友好的操作体验。

使用方法

先给出官方文档地址（给出了大量的示例和参考代码）：http://layer.layui.com/

轻松上手3步曲~~~

1.下载插件

2.放置插件

3.引用插件

代码+演示

---

layer.alert();

layer.alert("这是一个alert弹出层！");

以上是一个很简单的alert窗口，但我们可以对它的显示界面进行自定义，比如这个窗口的标题，默认显示的是“信息”，如果我想修改它，可以这样做。

layer.alert("这是一个alert弹出层！",{title:'这是一个新的标题'});

如果还不满意，觉得界面不够美观，我们可以为内容加个表情标识。（0-6的可选效果自行体验）

layer.alert("这是一个alert弹出层！",{title:'这是一个新的标题',icon:1});

---

layer.msg();

layer.msg("这是一个msg弹出层！");

这个弹出层较前面的弹出层更为简约，没有确定按钮也没有取消按钮（实际上是可以自定义添加的，下面会演示），弹出层到达默认显示时间自动销毁，如果不想让它销毁一直显示在页面上，我们可以这么做。

layer.msg("这是一个msg弹出层！",{time:0});

time属性代表当前弹出层的销毁时间，0代表永不销毁，如上这样，这个弹出层会一直显示（除非你刷新或关闭页面），该属性单位为毫秒。

除了可以自定义销毁时间，那我能不能给他加个按钮，主动让这个弹出层去销毁呢，答案是可以的。

layer.msg("这是一个msg弹出层！",{time:0,btn:['我知道了']});

我是否可以不通过按钮去关闭它，给它的弹出层的右上角加个关闭？答案，也是可以的。

layer.msg("这是一个msg弹出层！",{time:0,closeBtn:true});

---

layer.confirm();

layer.confirm("我是程序员？",{btn:['当然是','我不是']});

显然这样做没什么意义，那我们是否可以增加点击按钮后的函数呢，当然可以！

layer.confirm("我是程序员？", {
		btn : [ '当然是', '我不是' ]
	}, function() {
		layer.msg('您选择了当然是');
	}, function() {
		layer.msg('您选择了不是');
	});

---

layer.prompt();

layer.prompt({title:'请输入您的年龄'},function(txt,index){
		layer.close(index);
		if(txt == 18){
			layer.msg('您真的像花一样！');
			return;
		}
		layer.msg('原来你不是18岁！');
	});

请注意回调函数的使用，不再赘述。

---

layer.tips();

layer.tips('您发现了新大陆','.btn-primary');

---

layer.tab();

layer.tab({
  area: ['600px', '300px'],
  tab: [{
    title: 'TAB1', 
    content: '内容1'
  }, {
    title: 'TAB2', 
    content: '内容2'
  }, {
    title: 'TAB3', 
    content: '内容3'
  }]
});

---

结束

篇幅有限，还有很多有意思的属性参数没有介绍，大家自己摸索，参照官方文档就行。

想看更多参数属性，请点我

cs