完美iframe高度自适应代码

方法1:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">
<!--
body {
 background:url(http://voice.qq.com/love/images/page_bg.gif);
 font-family: "Verdana";
 font-size: 12px;
 margin: 0;
}
.fontred {color: #F00}
-->
</style>
</head><body>
<table width="750" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#00CCFF">
  <tr>
    <td height="200" align="center" valign="middle"><br><strong>页面内容区域</strong><br />
        <br />
        <span class="fontred"><strong>注:</strong>onload字段中的数值“200”为设置的Iframe最低高度值!</span><br />
      <br />
      <a href="/myfile/test/shortpage.htm" target="content">Iframe显示短页面</a>  <a href="/myfile/test/longpage.htm" target="content">Iframe显示长页面</a></td>
  </tr>
</table>
<table width="750" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#00CCFF">
  <tr>
    <td align="center" valign="top"><iframe src="/myfile/test/shortpage.htm" name="content" id="content" allowtransparency="true" align="default" marginwidth=0 marginheight=0 frameborder=0 scrolling=no height="200" width="500" onload="this.height=0;var fdh=(this.Document?this.Document.body.scrollHeight:this.contentDocument.body.offsetHeight);this.height=(fdh>200?fdh:200)//code by Backley">This message is only visible to older browsers.</iframe></td>
  </tr>
</table>
</body>
</html>


方法2:
<iframe src="pro_vew.asp" frameborder="0" scrolling="no" name="main"  onload="init();" width="100%" height="100%" align="top"></iframe>
        <script language="javascript">
        var lastHeight;
        function aaa()
        {
           document.all('main').height=main.document.body.scrollHeight;
        }
        function init()
        {
         aaa();
         setInterval(function (){
         if (lastHeight!=main.document.body.scrollHeight)
         aaa();
         },2)
         }
         </script> 


方法3:
<div style="border:1px solid #7e99c6" id="frameBox">
       <iframe id="frameWin" src="01.html" name="opWin" style="width:100%; height:100% " frameborder="0" scrolling="no" onload="test2()"></iframe>
</div>

js脚本(加在主页面):
function test2(){
       var frameWin = document.getElementById("frameWin");
       var frameBox = document.getElementById("frameBox");
       var newHeight;
       if (frameWin.Document){
              newHeight = frameWin.Document.body.scrollHeight + 20 + "px";
       }else{
              newHeight = frameWin.contentDocument.body.scrollHeight+ 20 + "px";
           或者  newHeight = frameWin.contentWindow.document.body.scrollHeight + 20 + "px";
       }
       frameWin.style.height = newHeight;
       frameBox.style.height = newHeight;
}

方法4:
<iframe id="iFrame1" name="iFrame1" width="100%" onload="this.height=iFrame1.document.body.scrollHeight" frameborder="0" scrolling="no" src="http://bbs.blueidea.com/thread-2861982-1-1.html"></iframe>
<!--重要提示:src填写的网页地址一定要和本页面在同一个站点上,否则会报错“拒绝访问!”-->
300*300
 文章首页关于迷茫时代关于我写意人生
版权所有:迷茫时代 All rights reserved   
执行时间:0.00514 秒