Tiramisu的Blog 发表于 2013-1-4 02:47:20

使用 Layer 弹出 iframe 层,并让 iframe 自适应内容宽高

<div id="cnblogs_post_body">1.Layer简介
layer 是一款使用非常方便且功能强健的 jQuery 弹出层插件,对各类浏览器中的兼容性也很好。使用它可以创建出交互体验更好的 Web 应用程序。
layer 的维护人员是一群和小G年龄相仿,富有激情的前端开发人员,所以大家不用担心它的升级问题。
layer 的官方网址:layer 官方演示与讲解
2.Layer的使用
(1) 访问官网下载最新版本的 layer,解压并将 插件添加至项目的根目录下;
(2) 在需要弹出层的页面引入 layer.min.js 文件(注意不要忘了引入 jQuery 类库),该文件包含内容即 layer 插件;
(3) 在适应的位置,添加 layer 的生成代码,示例如下:
<div id="codeSnippetWrapper" style="overflow: auto; cursor: text; font-size: 8pt; font-family: 'Courier New', courier, monospace; direction: ltr; text-align: left; margin: 20px 0px 10px; line-height: 12pt; max-height: 200px; width: 97.5%; background-color: #f4f4f4; border: silver 1px solid; padding: 4px;"><div id="codeSnippet" style="overflow: visible; font-size: 8pt; font-family: 'Courier New', courier, monospace; color: black; direction: ltr; text-align: left; line-height: 12pt; width: 100%; background-color: #f4f4f4; border-style: none; padding: 0px;">$.layer({         shade: '#000', false],         type: 2,         iframe: {             src: 'DataList.aspx'         },         title: ['', false],         closeBtn: true],         area: ['600px', '300px'],         move: ['.xubox_border', true],         offset: ['', ''],         success: function(layer) {             // 这里定义弹出层加载成功后要执行的内容         }   });
页: [1]
查看完整版本: 使用 Layer 弹出 iframe 层,并让 iframe 自适应内容宽高