最简单的方法去掉iframe滚动条
该文也可以说是一个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
相关阅读
- 04-07iframe 高度设置、iframe 自适应高度方法总结
- 09-28iframe自适应高度的多种方法方法小结
- 08-24广电宽带路由器设置方法
- 12-15jwgkvsq.vmx病毒清除方法(附jwgkvsq.vmx专杀工具)
- 06-25JS实现刷新iframe的方法
- 06-19解决IE7出现“网站安全证书有问题”方法
- 09-08用JS防止网站被挂IFRAME木马
- 08-06Win7宽带连接711错误的解决方法
- 01-01用 iframe 解决下拉框与层之冲突
- 04-25Windows服务器下查IIS被挂iframe木马
阅读本文后您有什么感想? 已有 人给出评价!
用户评论
热门评论
最新评论
相关软件
热点图文
- 06-25js中文显示乱码或在页面显示乱码解决方法
- 06-25最简单的方法去掉iframe滚动条
- 06-25JS 获取上传文件大小的方法
- 12-31js技巧之清除表单所有内容
- 06-09网站图片延迟加载的实现
- 06-25JavaScript下拉菜单实例
- 06-25js判断是否是IE浏览器的几种方法
- 12-31W3C中使用的对联漂浮广告代码
- 06-25JavaScript日期格式转换
- 06-25js返回上一页方法示例