I have used the following code to increase the iframe
height. This code working fine in Mozilla and IE, but not in Google Chrome.
<script type="text/javascript">
function calcHeight()
{
the_height = document.getElementById('the_iframe').contentWindow.document.body.scrollHeight;
document.getElementById('the_iframe').height = the_height + 35;
}
</script>
<iframe src="indexframe.html" id="the_iframe" onLoad="calcHeight();" name="home_frame" width="100%" frameborder="0" ></iframe>
如果您使用的是jQuery
$('#the_iframe').css({'height':(the_height+35)+'px'});
use document.documentElement.scrollHeight
in other than firefox
<iframe src="indexframe.html" id="the_iframe" onLoad="calcHeight();" name="home_frame" width="100%" frameborder="0" ></iframe>
<script type="text/javascript">
function calcHeight()
{
the_height=document.documentElement.scrollHeight;
document.getElementById('the_iframe').height=the_height+35;
}
</script>
The cross-browser way is a bit more complicated
<iframe src="indexframe.html" id="the_iframe" name="home_frame" width="100%" frameborder="0" ></iframe>
<script type="text/javascript">
var iframe = document.getElementById('the_iframe');
if (iframe.addEventListener) {
iframe.addEventListener('load', loader, false);
} else if (iframe.attachEvent) {
iframe.attachEvent("onload", loader);
} else {
iframe.onload = loader
}
function loader() {
var D = iframe.contentDocument ? iframe.contentDocument :
(iframe.contentWindow ? iframe.contentWindow.document : iframe.document),
the_height = Math.max(
D.body.scrollHeight, D.documentElement.scrollHeight,
D.body.offsetHeight, D.documentElement.offsetHeight,
D.body.clientHeight, D.documentElement.clientHeight
);
iframe.height = the_height+35;
}
</script>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.