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 相关文章推荐
在Z-Blog中运行代码[html][/html](纯JS版)
Mar 25 Javascript
Jquery中增加参数与Json转换代码
Nov 20 Javascript
IE7中javascript操作CheckBox的checked=true不打勾的解决方法
Dec 07 Javascript
获取body标签的两种方法
Oct 13 Javascript
使用javascript实现页面定时跳转总结篇
Sep 21 Javascript
浅析JavaScript中的常用算法与函数
Nov 21 Javascript
JavaScript闭包实例讲解
Apr 22 Javascript
纯js模拟div层弹性运动的方法
Jul 27 Javascript
jQuery制作网页版选项卡
Jul 28 Javascript
jquery动态创建div与input的实例代码
Oct 12 Javascript
Three.js实现绘制字体模型示例代码
Sep 26 Javascript
微信小程序上传图片功能(附后端代码)
Jun 19 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
Windows2003 下 MySQL 数据库每天自动备份
2006/12/21 PHP
PHP句法规则详解 入门学习
2011/11/09 PHP
PHP获取MSN好友列表类的实现代码
2013/06/23 PHP
PHP中批量生成静态html(命令行下运行PHP)
2014/04/19 PHP
Eclipse的PHP插件PHPEclipse安装和使用
2014/07/20 PHP
值得分享的php+ajax实时聊天室
2016/07/20 PHP
PHP大文件分块上传功能实例详解
2019/07/22 PHP
zeroclipboard复制到剪切板的flash
2010/08/04 Javascript
javascript实现可拖动变色并关闭层窗口实例
2015/05/15 Javascript
JavaScript实现无穷滚动加载数据
2017/05/06 Javascript
使用命令行工具npm新创建一个vue项目的方法
2017/12/27 Javascript
VUE实现可随意拖动的弹窗组件
2018/09/25 Javascript
Element Dialog对话框的使用示例
2020/07/26 Javascript
linux系统使用python监控apache服务器进程脚本分享
2014/01/15 Python
Python实例分享:快速查找出被挂马的文件
2014/06/08 Python
python输出指定月份日历的方法
2015/04/23 Python
django初始化数据库的实例
2018/05/27 Python
Python中关键字global和nonlocal的区别详解
2018/09/03 Python
Python闭包思想与用法浅析
2018/12/27 Python
详解使用django-mama-cas快速搭建CAS服务的实现
2019/10/30 Python
Pycharm内置终端及远程SSH工具的使用教程图文详解
2020/03/19 Python
在jupyter notebook 添加 conda 环境的操作详解
2020/04/10 Python
django 将自带的数据库sqlite3改成mysql实例
2020/07/09 Python
CSS3制作炫酷的下拉菜单及弹起式选单的实例分享
2016/05/17 HTML / CSS
FLIR美国官网:热成像, 夜视和红外摄像系统
2018/07/13 全球购物
工程概预算专业毕业生求职信
2013/10/04 职场文书
春节超市活动方案
2014/08/14 职场文书
解除劳动关系协议书2篇
2014/11/28 职场文书
2015年工会工作总结
2015/03/30 职场文书
幼儿园工作总结2015
2015/04/01 职场文书
环境卫生标语
2015/08/03 职场文书
2016圣诞节贺卡寄语
2015/12/07 职场文书
交通事故协议书范本
2016/03/19 职场文书
教师师德承诺书2016
2016/03/25 职场文书
《追风筝的人》:人心中的成见是座大山,但请不忘初心
2019/11/15 职场文书
了解Kubernetes中的Service和Endpoint
2022/04/01 Servers