iframe自适应高度的多种方法方法小结

《iframe自适应高度的多种方法方法小结》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、iframe自适应高度的多种方法方法小结  2011-03-1809:31:53

2、  分类：Html标签

3、  标签：

4、字号大中小 订阅对于自适应高度的代码有很多，可效率什么的考虑进来好代码就不多见了，不过思路倒是差不多的--不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能，可是iframe的大小却不像层那样可以“伸缩自如”，所以带来了使用上的麻烦，给iframe设置高度的时候多了也不好，少了更是不行，现在，让我来告诉大家一种iframe动态调整高度的方法，主要是以下JS函数：第一种方

5、法：代码简单，兼容性还可以，大家可以先测试下。复制代码代码如下:functionSetWinHeight(obj){varwin=obj;if(document.getElementById){if(win&&!window.opera){if(win.contentDocument&&win.contentDocument.body.offsetHeight)win.height=win.contentDocument.body.offsetHeight;elseif(win.Document&&win.Document.b

6、ody.scrollHeight)win.height=win.Document.body.scrollHeight;}}}最后，加入iframe,不能丢掉onload属性，当然了，id也必须也函数中的win匹配复制代码代码如下:这

7、么的这种也是跟上面的解决方法类似的代码经典代码iFrame自适应高度，在IE6/IE7/IE8/Firefox/Opera/Chrome/Safari通过测试。HTML代码：复制代码代码如下:Javascript代码：

8、vascript"language="javascript">functioniFrameHeight(){varifm=document.getElementById("iframepage");varsubWeb=document.frames?document.frames["iframepage"].document:ifm.contentDocument;if(ifm!=null&&subWeb!=null){ifm.height=subWeb.body.scrollHeight;}}下面这个兼容性

9、更好一些复制代码代码如下:functiondyniframesize(down){varpTar=null;if(document.getElementById){pTar=document.getElementById(down);}else{eval('pTar='+down+';');}if(pTar&&!window.opera){//beginresizingiframepTar.style.display="blo

10、ck"if(pTar.contentDocument&&pTar.contentDocument.body.offsetHeight){//ns6syntaxpTar.height=pTar.contentDocument.body.offsetHeight+20;pTar.width=pTar.contentDocument.body.scrollWidth+20;}elseif(pTar.Document&&pTar.Document.body.scrollHeight){//ie5+syntaxpTar.height=p

11、Tar.Document.body.scrollHeight;pTar.width=pTar.Document.body.scrollWidth;}}}