iframe自适应高度

转自: http://blog.csdn.net/jyy_12/article/details/7565464

jquery:在IE7/IE8下,由于加载顺序速度的关系,第一次打开有时获取不到内嵌页面的高度,有时又可以

[javascript]  view plain copy
  1. $("#frame_content").load(function(){  
  2.     var mainheight = $(this).contents().find("body").height()+60;  
  3.     $(this).height(mainheight);  
  4. });   

js:每隔一段时间计算iframe高度,适用变化的高度,document.body针对IE浏览器,document.documentElement针对火狐

[javascript]  view plain copy
  1. function reinitIframe(){  
  2.     var iframe =document.getElementById("frame_content");  
  3.     try{  
  4.         var bHeight = iframe.contentWindow.document.body.scrollHeight;  
  5.         var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;  
  6.         var height = Math.max(bHeight, dHeight);  
  7.         iframe.height =  height;  
  8.     }catch (ex){}  
  9. }  
  10. window.setInterval(reinitIframe, 200);  


注意:由于加载顺序的关系,都需以http形式打开页面才能生效。iframe会阻塞主页面的onload事件,主页面和iframe共享同一个连接池。在IE6、IE7、IE8下iframe的load事件会阻止window的load事件。


参考资料:

三谈Iframe自适应高度

再谈iframe自适应高度

iframe异步加载技术及性能


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值