讓iframe自適應高度

  寫代碼的過程中,遇到一個問題,就是用iframe加載一個動態的頁面,也就是iframe加載的這個頁面不是固定高度的。剛開始的時候我給iframe寫各種各樣的樣式,但效果都不能令我滿意,所以就到網上去搜一下這方面的資料,最後我選擇了像下面這樣的js方式代碼,這裏只是適應高度,寬度其實是一樣道理,就不寫那麼多了,這段js的原理,其實就是在一段很短的時間內不斷的去運行一段js方法,在方法裏面去獲取到iframe裏面動態內容的高度,然後再給iframe定一個高度。辦法是笨笨的,不過也很實在,此方法在跨域時不適用。

function reinitIframe(){

    var iframe = document.getElementById("Iframe");

    try{

        var bHeight = iframe.contentWindow.document.body.scrollHeight;

        var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;

        var height = Math.max(bHeight, dHeight);

        iframe.height =  height;

    }catch (ex){}

}

window.setInterval("reinitIframe()", 200);


 

你可能感兴趣的:(iframe)