快捷導(dǎo)航

如何實(shí)現(xiàn)iframe(嵌入式幀)的自適應(yīng)高度

更新時(shí)間：2006年07月26日 00:00:00 作者：

好幾次看到有人提問(wèn)問(wèn)到如何實(shí)現(xiàn) iframe 的自適應(yīng)高度，能夠隨著頁(yè)面的長(zhǎng)度自動(dòng)的適應(yīng)以免除頁(yè)面和 iframe 同時(shí)出現(xiàn)滾動(dòng)條的現(xiàn)象，剛好我在工作中也碰到了類似問(wèn)題，于是上網(wǎng)翻查，東抄抄西看看，弄出來(lái)這么一個(gè)函數(shù)，貼到頁(yè)面里面就能用了。不敢獨(dú)享，大家要是覺(jué)得有用，歡迎使用

源代碼如下

復(fù)制代碼代碼如下:

<script type="text/javascript"> 
 //** iframe自動(dòng)適應(yīng)頁(yè)面 **// 

 //輸入你希望根據(jù)頁(yè)面高度自動(dòng)調(diào)整高度的iframe的名稱的列表 
 //用逗號(hào)把每個(gè)iframe的ID分隔. 例如: ["myframe1", "myframe2"]，可以只有一個(gè)窗體，則不用逗號(hào)。 

 //定義iframe的ID 
 var iframeids=["test"] 

 //如果用戶的瀏覽器不支持iframe是否將iframe隱藏 yes 表示隱藏，no表示不隱藏 
 var iframehide="yes" 

 function dyniframesize()  
 { 
  var dyniframe=new Array() 
  for (i=0; i<iframeids.length; i++) 
  { 
   if (document.getElementById) 
   { 
    //自動(dòng)調(diào)整iframe高度 
    dyniframe[dyniframe.length] = document.getElementById(iframeids[i]); 
    if (dyniframe[i] && !window.opera) 
    { 
     dyniframe[i].style.display="block" 
     if (dyniframe[i].contentDocument && dyniframe[i].contentDocument.body.offsetHeight) //如果用戶的瀏覽器是NetScape 
      dyniframe[i].height = dyniframe[i].contentDocument.body.offsetHeight;  
     else if (dyniframe[i].Document && dyniframe[i].Document.body.scrollHeight) //如果用戶的瀏覽器是IE 
      dyniframe[i].height = dyniframe[i].Document.body.scrollHeight; 
    } 
   } 
   //根據(jù)設(shè)定的參數(shù)來(lái)處理不支持iframe的瀏覽器的顯示問(wèn)題 
   if ((document.all || document.getElementById) && iframehide=="no") 
   { 
    var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i]) 
    tempobj.style.display="block" 
   } 
  } 
 } 

 if (window.addEventListener) 
 window.addEventListener("load", dyniframesize, false) 
 else if (window.attachEvent) 
 window.attachEvent("onload", dyniframesize) 
 else 
 window.onload=dyniframesize 
</script> 