萬盛學電腦網 >> 網頁制作 >> 腳本Html教程 >> 動態的改變IFrame的高度
動態的改變IFrame的高度
動態的改變IFrame的高度，實現IFrame自動伸展，父頁面也自動神縮
原理： 在IFrame子頁面一加載的時候，調用父IFrame對象，改變其高度
具體實現:
1、在IFrame的具體頁面(就是子頁面)，添加JavaScript
<script>
function IFrameResize(){
//alert(this.document.body.scrollHeight); //彈出當前頁面的高度
var obj = parent.document.getElementById("childFrame"); //取得父頁面IFrame對象
//alert(obj.height); //彈出父頁面中IFrame中設置的高度
obj.height = this.document.body.scrollHeight; //調整父頁面中IFrame的高度為此頁面的高度
}
</script>
2、在IFrame的具體頁面(就是子頁面)的body中，添加onload事件
<body onload="IFrameResize()">
3、為父頁面的IFrame標簽添加ID，即上面第一步，方法體中的第2行所寫到的childFrame
<IFRAME border=0 marginWidth=0
frameSpacing=0 marginHeight=0
src="frame1.jsp" frameBorder=0
noResize scrolling="no" width=100% height=100% vspale="0" id="childFrame"></IFRAME>
腳本Html教程排行
程序編程推薦
相關文章
copyright © 萬盛學電腦網 all rights reserved