动态的改变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>   

动态的改变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>   

觉得可用，就经常来吧！ 欢迎评论哦！ html5教程，巧夺天工，精雕玉琢。小宝典献丑了！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！