layer.js插件使用一些心得

最近做的一个项目使用了一个叫做layer.js的插件，感觉很不错，在这里写下一些使用心得。

官方下载的地址与使用文档：http://sentsin.com/jquery/layer/

因为官方的使用演示讲解的已经非常清楚了，在这里我就讲解一下就我在项目中的使用心得。

 

情况一：操作请求在iframe页面中，但是弹窗希望是在整个页面中居中，也就是相当于父页面中的弹窗，也就是所谓的在iframe操作父页面

方法如下：在当前的iframe页面中写JS触发效果，希望弹窗的的DIV必须放在iframe父页面中，调用代码如下

     $("#addBank").click(function(){
        var docHeight = document.documentElement.clientHeight;
        top.$.layer({
            type : 1,
            title : '添加银行账号',
            fix : true,
            zIndex : 19891014,
            offset:[(docHeight/2-240)+'px' , ''],
            area : ['auto','350px'],
            page : {dom : '#addWrapper'}
        });
    });

其中top.$.layer就是调用的关键了，top是浏览器的内置对象，表示最顶层容器,这样一来就是实现了iframe控制父页面的弹窗效果了，

"#addWrapper"是父页面中的一个div，id为"addWrapper",其他的参数官方API里面都有详细介绍，这里我就不再啰嗦了

 

情况二：希望弹窗自定义显示的文字的样式，我们可以在接受参数message的时候使用如："<p style='text-align:center;'>你要显示的文字</p>"的方式来实现

 

 

 

转载于:https://www.cnblogs.com/wrflichen/p/layer.html