layer介绍与使用

官方网址：http://layer.layui.com/
layer是一款近年来备受青睐的web弹层组。
获得 layer 文件包后，解压并将 layer 整个文件夹（不要拆分结构） 存放到你项目的任意目录，使用时，只需引入 layer.js 即可。

<link rel="stylesheet" href="${ctx}/static/src/lib/layui/css/layui.css">
<script src="${ctx}/static/src/lib/layui/layui.all.js"></script>

在js中为对应的元素绑定点击事件，在方法中实现弹框。以下是一些例子：

弹出一个提示层

$('#test1').on('click', function(){
    layer.msg('hello');
});

弹出一个页面层

$('#test2').on('click', function(){
    layer.open({
        type: 1,
        area: ['600px', '360px'],
        shadeClose: true, //点击遮罩关闭
        content: '\<\div style="padding:20px;">自定义内容\<\/div>'
    });
});

iframe层-多媒体

<div class="Guidelines-OptionsVideo-list-video" onclick="loadVideo(this)">
    <input type="hidden" value="${message.fileurl}" />
    <video controls="controls" class="video" id="video">
        <source src="${message.fileurl}" type="video/mp4" />
    </video>
    <div class="Guidelines-OptionsVideo-list-output output" id="output"></div>
    <em></em>
</div>
function loadVideo(vid) {
    var url = $(vid).children("input").val();
    layer.open({
        type: 2,
        title: false,
        area: ['630px', '360px'],
        shade: 0.8,
        closeBtn: 0,
        shadeClose: true,
        content: url
        // content: '//player.youku.com/embed/XMjY3MzgzODg0'
    });
}