使用layer.js弹出一个iframe层(好用的弹出层插件)
2018-08-07 10:01
253 查看
layui框架官网http://www.layui.com/
layer使用说明http://layer.layui.com/hello.html
最近参与的一个客户管理项目里查看用户信息时发现这个效果很好用,
需要的效果是点击名字在屏幕中心出现弹窗,且弹窗有最大化按钮,点击后出现全页面。
这个效果用layer的iframe层来实现的话迷之方便,
使用手册里的调用代码:
[code] //弹出一个iframe层 $('#parentIframe').on('click', function(){ layer.open({ type: 2, title: 'iframe父子操作', maxmin: true, shadeClose: true, //点击遮罩关闭层 area : ['800px' , '520px'], content: 'test/iframe.html' }); });
在test/iframe.html中写了一个弹窗大小(比弹窗尺寸小一点点,因为不想在弹窗中看到滚动条)的盒子在页面中居中,这样弹窗中看到的正好是弹窗盒子里的内容,其他的也能参照layer的使用手册自己尝试,功能还是很强大哒。
渣渣草稿效果:
阅读更多相关文章推荐
- 打开一个iframe,从iframe更改父窗口parent里面的内容,jquery弹出窗口插件fancybox的使用
- 在Vue中使用layer.js弹出层插件
- 最近在使用MyEclipse的SVN插件时总是弹出一个大大的对话框,报一个Failed to load JavaHL Library.错误
- [原]发布一个jQuery弹出层插件,开源附主站,jquery.purebox.js
- [原]发布一个jQuery弹出层插件,开源附主站,jquery.purebox.js
- js 弹出框插件实例与代码使用方法
- 使用 Layer 弹出 iframe 层,并让 iframe 自适应内容宽高
- 最近在使用MyEclipse的SVN插件时总是弹出一个大大的对话框,报一个Failed to load JavaHL Library.错误
- 弹出层插件的编写-layer(跨iframe传值回调)
- 使用unslider.js图片轮播插件创建一个能轮播24节气的网页
- js使用showModalDialog,弹出一个自适应大小窗口
- jquery的layer弹出层框架,如果设置 iframe弹出一个页面里是表单提交,提交完怎么关闭弹出层
- 一个JQuery弹出对话框插件的使用
- 弹出框以及提示插件lghdialog.js的使用
- jQuery弹出窗口插件"LeanModal.js"的使用
- js无刷新无插件异步上传文件,使用dojo.io.iframe发送form数据包
- 使用jQuery fancybox插件打造一个实用的数据传输模态弹出窗体
- asp.net 如何使用js来判断一个网页是否处于iframe中
- 使用jQuery的message插件或js实现右下角弹出消息框
- 各种弹出层的一个插件,iframe,自定义大小等