layer是一款近年来备受青睐的web弹层组件，她具备全方位的解决方案，致力于服务各水平段的开发人员，您的页面会轻松地拥有丰富友好的操作体验。
插件官方地址：http://layer.layui.com/
layer 甚至兼容了包括IE6在内的所有主流浏览器。
少说多做，代码演示（拷贝直接运行）：
<!DOCTYPE html>
<html lang="zh"> <head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>弹出框插件layer使用</title>
</head> <body>
<div class="clearfix layer-area" id="chutiyan">
<a class="layui-btn layui-btn-primary" href="javascript:;">alert弹出框</a>
<a class="layui-btn layui-btn-primary" href="javascript:;">confirm弹出框</a>
</div>
<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/layer/3.0.1/layer.min.js"></script>
<script type="text/javascript">
$('#chutiyan>a').on('click', function() {
var othis = $(this),
index = othis.index();
switch(index) {
case 0:
layer.alert('弹出框内容', {
icon: -1,
shadeClose: true,
title: '弹出框标题'
});
break; case 1:
layer.confirm('您是如何看待前端开发？', {
btn: ['重要', '奇葩'] //按钮
}, function() {
layer.msg('重要', {
icon: 1
});
}, function() {
layer.msg('奇葩', {
icon: 1
});
});
break; default:
layer.msg('Hi!');
break;
}
});
</script>
</body> </html>
效果：
（1）alert弹出框
（2）confirm弹出框
3、总结
layer弹出框插件可保证所有浏览器弹出框效果一致，并且兼容IE6以上所有的浏览器，显著提升网站逼格。推荐使用。