绿色资源网

电脑版
提示:原网页已由神马搜索转码, 内容由www.downcc.com提供.
您的位置:首页网页设计网页特效→ 最简单的方法去掉iframe滚动条

最简单的方法去掉iframe滚动条

我要评论2012/06/25 11:20:21 来源:绿色资源网编辑:downcc.com 评论:0点击:1890次

  该文也可以说是一个iframe自适应大小的折中解决办法。iframe出现滚动条的原因是,body里面的内容的高度大于了iframe的高度,所以会出现滚动条。

  解决办法:

  采用Jquery从iframe嵌套的页面中获取一个高度值,在iframe的父窗口中的onload事件中更新iframe的高度。

  具体实现代码:

  父页面:

<script type="text/javascript">
function SetCwinHeight(){ 
   var H=$("#myiframe").contents().find("meta").attr("content"); 
   alert(H); 
   $("#myiframe2").height(H); 
} 
< /script>
< body style="overflow:auto;">
< iframe id="myiframe" src="xx.html" onLoad="SetCwinHeight()"></iframe>
< /body>
< script type="text/javascript">
function SetCwinHeight(){
      var H=$("#myiframe").contents().find("meta").attr("content");
    alert(H);
    $("#myiframe2").height(H);
     }
< /script>
< body style="overflow:auto;"><iframe id="myiframe" src="xx.html" ></iframe></body></html>

  子页面:

  Html代码

<meta content="800px">

  运行原理: 父页面读取子页面中meta的字段值来设置iframe的高度

  额外说明:

  当iframe 的高度小于内容高度时,如果父窗口的BODY 的overflow:auto,则会出现2个垂直滚动条,iframe的垂直滚动条和父窗口的滚动条;

  如果这时,BODY 的overflow:hidden,则只会出现iframe的垂直滚动条,但是,iframe的内容显示不完。

关键词:iframe

相关阅读

阅读本文后您有什么感想? 已有 人给出评价!

  • 11

  • 27

  • 437

  • 25

  • 39

  • 52

用户评论

热门评论

最新评论

发表评论查看所有评论(0)

昵称:
请不要评论无意义或脏话,我们所有评论会有人工审核.
字数: 0/500(您的评论需要经过审核才能显示)

相关软件

热点图文

    更多+

    精品软件