技术头条 - 一个快速在微博传播文章的方式     搜索本站
您现在的位置首页 --> JavaScript --> iframe自适应高度代码

iframe自适应高度代码

浏览:2804次  出处信息

有不少wBox的用户反映iframe时候不可以自动撑开高度,今天在无意中看到了司徒正美的一片关于iframe自适用高度的js代码,感觉不错,转载来了。

var adjustIframe = function (id) {
    var iframe = document.getElementById(id)
    var idoc = iframe.contentWindow && iframe.contentWindow.document || iframe.contentDocument;
    var callback = function () {
        var iheight = Math.max(idoc.body.scrollHeight, idoc.documentElement.scrollHeight); //取得其高
        iframe.style.height = iheight + "px";
    }
    if (iframe.attachEvent) {
        iframe.attachEvent("onload", callback);
    } else {
        iframe.onload = callback
    }
}
HTML代码如下所示: 

<iframe id="js_sub_web" width="80%" frameborder="0" scrolling="no" allowTransparency="true" src="http://www.cnblogs.com/rubylouvre/archive/2009/09/15/1566722.html">
</iframe>

使用代码:

window.onload = function(){
     adjustIframe("js_sub_web");
}

推荐几篇关于Iframe的文章:

  1. 再谈Iframe的问题
  2. 解决IE6 select z-index无效,遮挡div的bug
  3. 使用JavaScript在IE和Firefox下进行iframe的DOM操作
  4. 用document.domain+iframe实现Ajax跨子域
  5. 关于Ajax在浏览器中产生前进后退的实现方法

建议继续学习:

  1. iframe大小自适应    (阅读:8807)
  2. iframe里src="about:blank"的问题。    (阅读:6847)
  3. 跨域请求的iframe解决方案(1)    (阅读:5392)
  4. BO报表系统嵌入Iframe在firefox下的错误修改    (阅读:4632)
  5. ie下iframe输入框焦点丢失解决方案    (阅读:4295)
  6. 三谈Iframe自适应高度    (阅读:3639)
  7. 使用document.domain和iframe实现站内AJAX跨域    (阅读:3313)
  8. Google+开发团队分享经验    (阅读:3309)
  9. 跨域请求的iframe解决方案(2)    (阅读:3146)
  10. IFrame带来的Session问题    (阅读:2789)
QQ技术交流群:445447336,欢迎加入!
扫一扫订阅我的微信号:IT技术博客大学习
© 2009 - 2024 by blogread.cn 微博:@IT技术博客大学习

京ICP备15002552号-1