为了使iframe不出现滚动条(使用浏览器自身的滚动条),需要把iframe内嵌页面的scrollHeight高度设置给iframe的height,这里需要注意的是,在设置iframe高度前需要把iframe的高度清空下,具体如下:
<iframe id="contentFrameID" style="display:none;width:100%;" scrolling="no" frameborder="0" src="about:blank"></iframe>
/**
* iframe 高度自适应js
*/
$(document).ready(function(){
window.iframeResize = function(){
var dvalue = 0;
if($.browser.safari){
dvalue = 67
}
parent.document.getElementById("contentFrameID").scrolling = "no";
parent.document.getElementById("contentFrameID").height = "";
parent.document.getElementById("contentFrameID").style.height = "";
parent.document.getElementById("contentFrameID").height = document.body.scrollHeight + dvalue;
}
if(window.iframeResize){
window.iframeResize();
}
});
目前在IE9、8、7,谷歌,firefox浏览器下显示符合要求。
分享到:
相关推荐
本文实例讲述了jQuery获取与设置iframe高度的方法。分享给大家供大家参考,具体如下: 设置iframe的高度,iframe的高度由iframe中的页面高度决定。 1.首先获取到iframe中页面的高度: 复制代码 代码如下:var iframe...
javascript动态调整iframe高度
Iframe自动根据类容改变自己的大小,解决Iframe设置高度后无法缩小!拜一个高人所赐,特表示感谢!
JavaScript自动设置IFrame高度的小例子,需要的朋友可以参考一下
我们可以通过属性或者CSS来设置iframe的高度,当不确定子页面内容的高度时,也可以通过脚本来进行动态指定。但是如果子页面不在同一域中怎么办?这时候脚本没有办法获取到子页面的高度,存在JavaScript跨域的问题!
iframe包含的页面的高度,兼容性好,iframe高度自适应
NULL 博文链接:https://wj98127.iteye.com/blog/487166
iframe设置高度随子页高度的变化而变化 0分资源共享
IFrame高度的设置问题一直都是前端的噩梦而且还要兼容各主流浏览器更是难上加难了,下面与大家分享下一个不错的技巧,感兴趣的你可以参考下哈
iframe高度自适应。点击链接载入网页,脚本检测iframe页面高度并动态增加父页面高度
iframe自适应高度和宽度
iframe 自适应高度iframe 自适应高度iframe 自适应高度iframe 自适应高度iframe 自适应高度iframe 自适应高度iframe 自适应高度iframe 自适应高度
纯JS实现的iframe自适应高度。兼容主流浏览器。
iframe高度自适应代码及演示页面。 适合新手,用到iframe,并且需要高度自适应的人士。 老手自动绕行,又没什么技术含量。。。 解压之后,打开iframe-auto.html之后查看效果. 如果不能查看,检查是否允许执行js
iframe 跨域 自适应高度 模板 iframe 跨域 自适应高度 模板 iframe 跨域 自适应高度 模板
iframe 跨域 自动适应高度;iframe 跨域 自动适应高度;
iframe之间进行控制,这样更有利于程序的编写,希望对大家有所帮助。