iframe自适应高度代码

断桥残雪部落格 2011-08-23 13:24:07 浏览 3,822 次

标签 iframe 自适应

有不少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的文章：

建议继续学习

iframe大小自适应（阅读 9,882）
iframe里src="about:blank"的问题。（阅读 7,901）
跨域请求的iframe解决方案（1）（阅读 6,321）
BO报表系统嵌入Iframe在firefox下的错误修改（阅读 5,543）
ie下iframe输入框焦点丢失解决方案（阅读 5,386）
三谈Iframe自适应高度（阅读 4,584）
Google+开发团队分享经验（阅读 4,480）
使用document.domain和iframe实现站内AJAX跨域（阅读 4,462）
跨域请求的iframe解决方案（2）（阅读 4,124）
IFrame带来的Session问题（阅读 3,945）