iframe高度变化(Iframe根据子页面内容高度自适应)
自适应高度,其实就是设置iframe的高度,使其等于内嵌网页的高度,从而看不出来滚动条和嵌套痕迹。用户体验更好和网站美观。
如果内容是固定的,那么我们可以通过CSS来给它直接定义一个高度。当内容是未知或者是变化的时候。这个时候就得更具子页面的高度来调节iframe的高,使得满足应该户的需求。
我们可以给它添加一个默认的CSS的min-height值,然后同时使用javascript改变高度。代码如下:
<iframe id="myiframe" name="myiframe" src="http://img.studyofnet.comh_default.html" onload="iframeLoad()" scrolling="no" width="100%" height=""></iframe>
<script type="text/javascript">
function iframeLoad() {
var iframe = document.getElementById("myiframe");
var iframeWin = iframe.contentwindow || iframe.contentDocument.parentWindow;
if(iframe) {
iframe.height = iframeWin.document.body.scroll;
if(iframeWin.document.body)
iframe.height = iframeWin.document.documentElement.scrollHeight;
}
}
//window.setInterval("iframeLoad()", 20);
</script>
,免责声明:本文仅代表文章作者的个人观点,与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺,请读者仅作参考,并自行核实相关内容。文章投诉邮箱:anhduc.ph@yahoo.com