javascript应用:Iframe自适应其加载的内容高度


Posted in Javascript onApril 10, 2007

main.htm: 

<html>    
    <head>    
       <meta  http-equiv='Content-Type'  content='text/html;  charset=gb2312'>    
       <meta  name='author'  content='F.R.Huang(meizz梅花雪)//www.meizz.com'>    
       <title>iframe自适应加载的页面高度</title>    
    </head>        <body>  
        <iframe src="child.htm"></iframe>  
    </body>  
</html>

child.htm:
<html>  
<head>  
   <meta  http-equiv='Content-Type'  content='text/html;  charset=gb2312'>  
   <meta  name='author'  content='F.R.Huang(meizz梅花雪)//www.meizz.com'>  
   <title>iframe  自适应其加载的网页(多浏览器兼容)</title>  
   <script  language=javascript>
   function iframeAutoFit()
   {
      try
      {
         if(window!=parent)
         {
          var a = parent.document.getElementsByTagName("IFRAME");
            for(var i=0; i<a.length; i++) //author:meizz
            {
               if(a[i].contentWindow==window)
               {
                   var h = document.body.scrollHeight;
                   if(document.all) {h += 4;}
                   if(window.opera) {h += 1;}
                   a[i].style.height = h;
               }
            }
         }
      }
      catch (ex)
      {
         alert("脚本无法跨域操作!");
      }
   }
   if(document.attachEvent)  window.attachEvent("onload",  iframeAutoFit);  
   else  window.addEventListener('load',  iframeAutoFit,  false);  
   </script>  
</head>  
<body>  
   <div  style="width:  200;  height:  400;  background-color:  yellow">  
       iframe  自适应其加载的网页(多浏览器兼容)  
   </div>  
</body>  
</html>

Javascript 相关文章推荐
获取任意Html元素与body之间的偏移距离 offsetTop、offsetLeft (For:IE5+ FF1 )[
Dec 22 Javascript
js获取指定日期前后的日期代码
Aug 20 Javascript
两种方法实现在HTML页面加载完毕后运行某个js
Jun 16 Javascript
JavaScript获取图片真实大小代码实例
Sep 24 Javascript
js图片模糊切换显示特效的方法
Feb 17 Javascript
JavaScript实现选择框按比例拖拉缩放的方法
Aug 04 Javascript
Bootstrap Table从服务器加载数据进行显示的实现方法
Sep 29 Javascript
javascript另类方法实现htmlencode()与htmldecode()函数实例分析
Nov 17 Javascript
javascript 作用于作用域链的详解
Sep 27 Javascript
微信小程序动态生成二维码的实现代码
Jul 25 Javascript
vue 中 beforeRouteEnter 死循环的问题
Apr 23 Javascript
vue excel上传预览和table内容下载到excel文件中
Dec 10 Javascript
用javascript动态调整iframe高度的代码
Apr 10 #Javascript
Javascript下的keyCode键码值表
Apr 10 #Javascript
用javascript控制iframe滚动的代码
Apr 10 #Javascript
经常用到的JavasScript事件的翻译
Apr 09 #Javascript
在JavaScript中通过URL传递汉字的方法
Apr 09 #Javascript
Javascript中eval函数的使用方法与示例
Apr 09 #Javascript
给网站上的广告“加速”显示的方法
Apr 08 #Javascript
You might like
mysql 字段类型说明
2007/04/27 PHP
php下通过IP获取地理位置的代码(小偷程序)
2011/06/09 PHP
php float不四舍五入截取浮点型字符串方法总结
2013/10/28 PHP
php配合jquery实现增删操作具体实例
2013/12/12 PHP
php如何解决无法上传大于8M的文件问题
2014/03/10 PHP
OAuth认证协议中的HMACSHA1加密算法(实例)
2017/10/25 PHP
PHP设计模式之 策略模式Strategy详解【对象行为型】
2020/05/01 PHP
3个可以改善用户体验的AngularJS指令介绍
2015/06/18 Javascript
jquery+html5烂漫爱心表白动画代码分享
2015/08/24 Javascript
js实现简单的省市县三级联动效果实例
2016/02/18 Javascript
es6系列教程_ Map详解以及常用api介绍
2017/09/25 Javascript
AngularJS实现的获取焦点及失去焦点时的表单验证功能示例
2017/10/25 Javascript
Vue添加请求拦截器及vue-resource 拦截器使用
2017/11/23 Javascript
深入理解ES6之数据解构的用法
2018/01/13 Javascript
完美解决axios在ie下的兼容性问题
2018/03/05 Javascript
vue element-ui 绑定@keyup事件无效的解决方法
2018/03/09 Javascript
如何从零开始利用js手写一个Promise库详解
2018/04/19 Javascript
node.js环境搭建图文详解
2018/09/19 Javascript
详解基于node.js的脚手架工具开发经历
2019/01/28 Javascript
JavaScript冒泡算法原理与实现方法深入理解
2020/06/04 Javascript
解决vue单页面多个组件嵌套监听浏览器窗口变化问题
2020/07/30 Javascript
[54:29]2018DOTA2亚洲邀请赛 4.7 淘汰赛 VP vs LGD 第二场
2018/04/09 DOTA
[36:43]NB vs Optic 2018国际邀请赛小组赛BO1 B组加赛 8.19
2018/08/21 DOTA
Python字符串匹配算法KMP实例
2015/07/18 Python
Python的Flask框架中SQLAlchemy使用时的乱码问题解决
2015/11/07 Python
Python实现的多进程和多线程功能示例
2018/05/29 Python
python 自动重连wifi windows的方法
2018/12/18 Python
简述python Scrapy框架
2020/08/17 Python
Blue Nile台湾:钻石珠宝商,订婚首饰、结婚戒指和精品首饰
2017/11/24 全球购物
Hunter Boots美国官方网站:赫特威灵顿雨靴
2018/06/16 全球购物
菲律宾优惠券网站:MetroDeal
2019/04/12 全球购物
一套比较完整的软件测试人员面试题
2012/05/13 面试题
体育教师自荐信范文
2013/12/16 职场文书
一年级学生评语大全
2014/04/21 职场文书
党员服务承诺书
2014/05/28 职场文书
实战 快速定位MySQL的慢SQL
2022/03/22 MySQL