iframe 自适应高度,多层嵌套iframe自适应高度

一、单个iframe 高度自适应
<iframe src="yx/yx_list.html" width="100%" onload=" this.height=this.contentWindow.document.body.scrollHeight" scrolling="no" name="rtFrame" frameborder="0"></iframe>



当前窗口自适应高度:this.height=this.contentWindow.document.body.scrollHeight

子窗体窗口自适应高度:
window.parent.document.getElementById("rtFrame").height=document.body.scrollHeight;


二、多层嵌套iframe 高度自适应
A页面的iframe 加载B.html文件:
<iframe id="frame_content" src=”B.html“ name="right" width="1003" frameborder="0" scrolling="no" ></iframe>

B.html页面也有一个iframe:
<iframe width="750" name="rightform" id="rightform" src="KinTimMng_right_init.php" frameborder="0" scrolling="no" onload="this.height=this.contentWindow.document.body.scrollHeight;parent.document.getElementById('frame_content').style.height= document.body.scrollHeight + 'px';" ></iframe>


onload的时候执行了两条js语句

1、设置当前iframe自己的高度自适应
this.height=rightform.document.body.scrollHeight 

2、设置父iframe的高度自适应(注意后面的高度单位px,如果不加单位,firefox下不起作用)
parent.document.getElementById('frame_content').style.height= document.body.scrollHeight + 'px'



你可能感兴趣的:(iframe)