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 相关文章推荐
JavaScript去掉数组中的重复元素
Jan 13 Javascript
从零开始学习jQuery (八) 插播:jQuery实施方案
Feb 23 Javascript
document.write的几点使用心得
May 14 Javascript
javascript模拟C#格式化字符串
Aug 26 Javascript
浅谈JSON.stringify()和JOSN.parse()方法的不同
Aug 29 Javascript
jquery自定义插件结合baiduTemplate.js实现异步刷新(附源码)
Dec 22 Javascript
基于rollup的组件库打包体积优化小结
Jun 18 Javascript
vue实现select下拉显示隐藏功能
Sep 30 Javascript
12 种使用Vue 的最佳做法
Mar 30 Javascript
uniapp 仿微信的右边下拉选择弹出框的实现代码
Jul 12 Javascript
js实现拖拽元素选择和删除
Aug 25 Javascript
详解webpack的clean-webpack-plugin插件报错
Oct 16 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
php下统计用户在线时间的一种尝试
2010/08/26 PHP
关于Zend Studio 配色方案插件的介绍
2013/06/24 PHP
extjs 学习笔记(二) Ext.Element类
2009/10/13 Javascript
extjs 学习笔记(三) 最基本的grid
2009/10/15 Javascript
当jQuery遭遇CoffeeScript的时候 使用分享
2011/09/17 Javascript
js控制页面控件隐藏显示的两种方法介绍
2013/10/09 Javascript
iframe的onreadystatechange事件在firefox下的使用
2014/04/16 Javascript
javascript使用window.open提示“已经计划系统关机”的原因
2014/08/15 Javascript
Jquery实现鼠标移动放大图片功能实例
2015/03/25 Javascript
详解JavaScript中void语句的使用
2015/06/04 Javascript
jQuery检测返回值的数据类型
2015/07/13 Javascript
html5 canvas 详细使用教程
2017/01/20 Javascript
angularjs+bootstrap实现自定义分页的实例代码
2017/06/19 Javascript
JS失效 提示HTML1114: (UNICODE 字节顺序标记)的代码页 utf-8 覆盖(META 标记)的冲突的代码页 utf-8
2017/06/23 Javascript
详解基于webpack2.x的vue2.x的多页面站点
2017/08/21 Javascript
JS实现的小火箭发射动画效果示例
2018/12/08 Javascript
Javascript异步执行不按顺序解决方案
2020/04/30 Javascript
[04:09]显微镜下的DOTA2第十二期—NaVi美如画的团战
2014/06/23 DOTA
python OpenCV学习笔记实现二维直方图
2018/02/08 Python
python实现俄罗斯方块游戏
2020/03/25 Python
python基于SMTP协议发送邮件
2019/05/31 Python
如何在VSCode上轻松舒适的配置Python的方法步骤
2019/10/28 Python
python groupby 函数 as_index详解
2019/12/16 Python
基于pytorch 预训练的词向量用法详解
2020/01/06 Python
Python面向对象魔法方法和单例模块代码实例
2020/03/25 Python
浅谈django 模型类使用save()方法的好处与注意事项
2020/03/28 Python
python tkinter的消息框模块(messagebox,simpledialog)
2020/11/07 Python
CSS去掉A标签(链接)虚线框的方法
2014/04/01 HTML / CSS
h5实现获取用户地理定位的实例代码
2017/07/17 HTML / CSS
狗狗玩具、零食和咀嚼物的月度送货服务:Super Chewer
2018/08/22 全球购物
机械专业毕业生自荐信
2013/11/02 职场文书
大学生学习面向未来的赶考思想汇报
2014/09/12 职场文书
采购员岗位职责
2015/02/03 职场文书
幼儿园教师读书笔记
2015/06/29 职场文书
2016年学校“6﹒26国际禁毒日”宣传活动总结
2016/04/05 职场文书
解决MultipartFile.transferTo(dest) 报FileNotFoundExcep的问题
2021/07/01 Java/Android