轉自:http://www.cnblogs.com/qiufuwu618/archive/2012/09/12/2682202.html
經典代碼 iFrame 自適應高度,在IE6/IE7/IE8/Firefox/Opera/Chrome/Safari通過測試。
很古老的方法:
<iframe src="../Index.aspx" id="iframe" frameborder="0" scrolling="no" οnlοad="iFrameHeight();" width="100%"></iframe> function iFrameHeight() { var ifm = document.getElementById("iframe"); var subWeb = document.frames ? document.frames["iframe"].document : ifm.contentDocument; if (ifm != null && subWeb != null) { ifm.height = subWeb.body.scrollHeight; } }
下面的兩種Jquery方法選擇一種即可,很簡單,不用判斷瀏覽器高度、寬度等。
jquery代碼1:
//注意:下面的代碼是放在iframe引用的子頁面中調用 $(window.parent.document).find("#iframe").load(function(){ var main = $(window.parent.document).find("#iframe"); var thisheight = $(document).height()+30; main.height(thisheight); });
jquery代碼2:
//注意:下面的代碼是放在和iframe同一個頁面調用 $("#iframe").load(function(){ var mainheight = $(this).contents().find("body").height()+30; $(this).height(mainheight); });
還有其他的種種...