(转)用javascript动态调整iframe高度

当你在页面上使用了iframe之后，一般来说会不希望iframe显示难看的滚动条，以使iframe里面 的内容和主页面的内容浑然一体。这时候你会设置 scrolling="no" 属性。但是这样一来如果iframe里面的内容是变化的，高度会随之内容的变化而变化的时候，你的iframe就会显得太长导致底下一大片空白，或者正好 相反，由于iframe的高度太小导致一部分内容会被挡住。这里我提供一个兼容IE/NS/Firefox的javascript脚本实现动态调整 iframe的高度。如果需要调整宽度的话，原理是一样的，本文不加详述

首先，在你的主页面上必须包含以下这段javascript代码：

 

 1      < script language = " javascript "  type = " text/javascript " >
 2          var  getFFVersion = navigator.userAgent.substring(navigator.userAgent.indexOf( " Firefox " )).split( " / " )[ 1 ]
 3          // extra height in px to add to iframe in FireFox 1.0+ browsers   
 4          var  FFextraHeight = getFFVersion >= 0.1 ?   16  :  0   
 5          function  dyniframesize(iframename)
 6          {
 7              var  pTar  =   null ;
 8              if  (document.getElementById)
 9              {
10                 pTar  =  document.getElementById(iframename); 
11             }
12              else
13              {  
14                 eval( ' pTar =  '   +  iframename  +   ' ; ' ); 
15             }
16              if  (pTar  &&   ! window.opera)
17              {
18                  // begin resizing iframe
19                 pTar.style.display = " block "  
20                  if  (pTar.contentDocument  &&  pTar.contentDocument.body.offsetHeight)
21                  {
22                      // ns6 syntax 
23                     pTar.height  =  pTar.contentDocument.body.offsetHeight + FFextraHeight;
24                 }
25                  else   if  (pTar.Document  &&  pTar.Document.body.scrollHeight)
26                  {
27                      // ie5+ syntax 
28                     pTar.height  =  pTar.Document.body.scrollHeight;
29                 }
30             }
31         }  
32      < / script>

然后对于主页面用到iframe的地方添加代码：

1 < iframe  id ="OrderFrame"  src ="MyOrders.aspx"  marginwidth =0  marginheight =0  width =200 

height =100  frameborder =0  scrolling =no  onload ="javascript:{dyniframesize('OrderFrame');}" ></ iframe >

 

 

链接地址：http://www.cnblogs.com/agloat/articles/1203747.html#1357953