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 相关文章推荐
几行代码轻松搞定jquery实现flash8类似的连接效果
May 03 Javascript
jQuery 1.4 15个你应该知道的新特性(译)
Jan 24 Javascript
javascript实用小函数使用介绍
Nov 11 Javascript
Get中文乱码IE浏览器Get中文乱码解决方案
Dec 26 Javascript
jquery实现ajax提交表单信息的简单方法(推荐)
Aug 24 Javascript
jq checkbox 的全选并ajax传参的实例
Apr 01 Javascript
vue2.0的contextmenu右键弹出菜单的实例代码
Jul 24 Javascript
基于bootstrop常用类总结(推荐)
Sep 11 Javascript
Vue vm.$attrs使用场景详解
Mar 08 Javascript
微信小程序自定义联系人弹窗
May 26 Javascript
JavaScript中变量提升和函数提升的详解
Aug 07 Javascript
梳理一下vue中的生命周期
Dec 30 Vue.js
用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 中InnoDB和MyISAM的区别分析小结
2008/04/15 PHP
超级好用的一个php上传图片类(随机名,缩略图,加水印)
2010/06/30 PHP
解析如何用php screw加密php源代码
2013/06/20 PHP
摘自织梦CMS中的图片处理类
2015/08/08 PHP
php使用lua+redis实现限流,计数器模式,令牌桶模式
2019/04/04 PHP
让你的网站可编辑的实现js代码
2009/10/19 Javascript
jQuery的cookie插件实现保存用户登陆信息
2014/04/15 Javascript
Juery解决tablesorter中文排序和字符范围的方法
2015/05/06 Javascript
JavaScript动态添加style节点的方法
2015/06/09 Javascript
jqTransform美化表单
2015/10/10 Javascript
Node.js模块封装及使用方法
2016/03/06 Javascript
Angular.js与Bootstrap相结合实现表格分页代码
2016/04/12 Javascript
ES6新特性之类(Class)和继承(Extends)相关概念与用法分析
2017/05/24 Javascript
ES6使用Set数据结构实现数组的交集、并集、差集功能示例
2017/10/31 Javascript
JS实现用特殊符号替换字符串的中间部分区域的实例代码
2018/07/24 Javascript
在vue项目中使用sass语法问题
2019/07/18 Javascript
vue子传父关于.sync与$emit的实现
2019/11/05 Javascript
JS求解两数之和算法详解
2020/04/28 Javascript
vue实现点击按钮“查看详情”弹窗展示详情列表操作
2020/09/09 Javascript
[01:38]完美世界DOTA2联赛PWL S3 集锦第四期
2020/12/21 DOTA
python利用hook技术破解https的实例代码
2013/03/25 Python
python实现在控制台输入密码不显示的方法
2015/07/02 Python
Python中字典(dict)合并的四种方法总结
2017/08/10 Python
Python实现ping指定IP的示例
2018/06/04 Python
Python 解决相对路径问题:&quot;No such file or directory&quot;
2020/06/05 Python
keras model.fit 解决validation_spilt=num 的问题
2020/06/19 Python
如何将anaconda安装配置的mmdetection环境离线拷贝到另一台电脑
2020/10/15 Python
玩转CSS3色彩
2010/01/16 HTML / CSS
CSS去掉A标签(链接)虚线框的方法
2014/04/01 HTML / CSS
html5版canvas自由拼图实例
2014/10/15 HTML / CSS
HTML5 audio标签使用js进行播放控制实例
2015/04/24 HTML / CSS
工程项目建议书范文
2014/03/12 职场文书
2019新员工心得体会
2019/06/25 职场文书
mysql联合索引的使用规则
2021/06/23 MySQL
基于Python和openCV实现图像的全景拼接详细步骤
2021/10/05 Python
python中pymysql包操作数据库方法
2022/04/19 Python