帐号: 密码:
// 设为首页 // 收藏本站 // 请您留言 // 网址导航
远方教程-满足你的求知欲!
站内搜索:
HTML ASP PHP CSS DIV Dreamweaver Photoshop Word Excel PPT SEO技巧
您当前位置:网站首页 >> HTML入门 >> HTML常用技巧 >> 阅读文章

iframe自适应高度

来源:远方教程 作者:远方教程 发布时间:2013-10-16 查看次数:2174 访问[新版]

  iframe是非常常用的网页代码,这一讲给大家讲如何让iframe去自适应高度。

function SetWinHeight(obj){
 var win=obj;
 if (document.getElementById){
  if (win && !window.opera){
   if (win.contentDocument && win.contentDocument.body.offsetHeight)
    win.height = win.contentDocument.body.offsetHeight;
   else if(win.Document && win.Document.body.scrollHeight)
    win.height = win.Document.body.scrollHeight;
 }
}

 <iframe src="center.jsp" allowtransparency="true"  name="right" width="100%" height="500" scrolling="no"
         frameborder="0" id="window3" border="0" noresize="noresize" framespacing="0" onload="Javascript:SetWinHeight(this)"></iframe>   

//---------------------------
//多层iframe嵌套时,里层的iframe自适应高度的同时,控制外层iframe的高度(应该可以达到自适应,本例将外层iframe的高度写死)
//注意,获取外层iframe的方法parent.document.getElementById().height='450px';
//注意,附值高度时,加“px”像素标记。
<script type="text/javascript">

  function SetWinHeight(obj){
   var win=obj;
   if (document.getElementById){
    if (win && !window.opera){
     if (win.contentDocument && win.contentDocument.body.offsetHeight) {
      win.height = win.contentDocument.body.offsetHeight;
      parent.document.getElementById("window3").hieght = win.height;
     }else if(win.Document && win.Document.body.scrollHeight){
      win.height = win.Document.body.scrollHeight;
      win.style.height = win.height + "px";
      //测试时出现问题:ie中,style的高度没改,属性改了,框架高度没变,用
      下面的方法改动样式的高度,问题解决了。
      //parent.document.getElementById("window3").height='450px';
        }
   }
  }
  }

   function openUrl(url){
         $("#tcInfos").show();
         $("#window4").attr("src",url);//jquery iframe跳转
   }

</script>

打印 打印 | 关闭 关闭 评论
下一篇:没有了
相关文章
图片新闻
站内搜索  
搜索
猜您喜欢  
最新更新  
阅读排行  
关于我们 | 联系方式 | 大事记 | 免责声明 | | 给我留言
部分广告源自金山联盟2345联盟 QQ咨询 站长之家QQ群:232617873
Copyright 2024 远方教程 © All Rights Reserved.

回顶部