前一段时间在一个jsp页面中加载一个html页面,通过使用iframe加载html页面,但是在动态调整iframe的大小时无法兼容各个浏览器,后来在网上找到针对各个流浪器对iframe进行动态调整的代码,并将代码进行了整合,现在使用下面方法可以完美的兼容各个浏览器。
<iframe style=" position:absolute; left:330px; top:200px " width="750px" frameBorder="0" frameSpacing="0" scrolling="no" marginHeight="0" marginWidth="0" src="http://localhost:8080/web/doc/index.html" id="rightContent" name="rightContent"
onload="reinitIframe()"></iframe>
function reinitIframe(){
var iframe = document.getElementById("rightContent");var iframeDocument = null;
//safari和chrome都是webkit内核的浏览器,但是webkit可以
if (iframe.contentDocument)
{
//ie 8,ff,opera,safari
iframeDocument = iframe.contentDocument;
}
else if (iframe.contentWindow)
{
// for IE, 6 and 7:
iframeDocument = iframe.contentWindow.document;
}
if (!!iframeDocument) {
iframe.width=iframeDocument.documentElement.scrollWidth+"px";
iframe.height=iframeDocument.documentElement.scrollHeight+"px";
} else {
//for chorme
var bHeight = iframe.contentDocument.body.scrollHeight;
var dHeight = iframe.contentDocument.documentElement.scrollHeight;
var height = Math.max(bHeight, dHeight);
iframe.height = height;
}
}
本文介绍了一种在不同浏览器下实现iframe元素大小动态调整的方法。通过检测浏览器类型并应用特定的JavaScript代码,可以确保iframe在各种浏览器环境中正确显示加载的内容。
202

被折叠的 条评论
为什么被折叠?



