iframe滚动条解决办法_去除iframe滚动条方法

时间：2026-07-18 10:56:00来源：汇创宝软件作者：佚名用手机看

扫描二维码随身看资讯

使用手机 二维码应用 扫描右侧二维码，您可以
1. 在手机上细细品读~
2. 分享给您的微信好友或朋友圈~

该文也可以说是一个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 onl oad=SetCwinHeight()></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 ></iframe>

子页面：

Html代码

<meta content=800px>

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

额外说明：

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

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

相关阅读
热门文章
推荐专题
网络软件大全
电脑聊天软件大全
图文推荐