知识点 词汇表 联系我们
按类别浏览
内容搜索    
当前位置:WEB开发技术知识库(www.cn-web.com) .: WEB技术相关 .: JavaScript .: 实现网页自适应iframe内嵌网页的高度

实现网页自适应iframe内嵌网页的高度


因为网页需要内置在iframe中,而且内置的网页是外部域的,是多变且不可预测的(需要由客户需求来决定),所以网页规格大小是多样的,现在把它们内置在我的网页中,需要让我的网页自适应它们的高度以免布局失控,有一种最简单的办法就是在内置的网页里加入一句代码“"parent.document.all("框架ID名").style.height=document.body.scrollHeight;”就可以了,但是因为现在的情况是内置的网页不可控制、不可预测,经过查找资料,加入下面函数就可解决:
<script type="text/javascript">
 //** iframe自动适应页面 **//
 //输入你希望根据页面高度自动调整高度的iframe的名称的列表
 //用逗号把每个iframe的ID分隔. 例如: ["myframe1", "myframe2"],可以只有一个窗体,则不用逗号。
 //定义iframe的ID
 var iframeids=["opentranurl"]
 //如果用户的浏览器不支持iframe是否将iframe隐藏 yes 表示隐藏,no表示不隐藏
 var iframehide="yes"
 function dyniframesize()
 {
  var dyniframe=new Array()
  for (i=0; i<iframeids.length; i++)
  {
   if (document.getElementById)
   {
    //自动调整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;
    }
   }
   //根据设定的参数来处理不支持iframe的浏览器的显示问题
   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>


对此文章打分评级

用户评论

增加评论
此文章还没有任何评论!
网站地图 - 知识词汇 - 全文检索 - 广告服务 - 帮助中心 - 联系我们
.:www.cn-web.com
网站技术开发联盟之WEB开发技术知识库
联系人:老韩(QQ:5679551)
晋ICP备07003487号