happy175 发表于 2015-3-20 17:01:02

iframe高度自适应方法,未

总结两种方法,第一种是在网上查资料然后总结出来的,兼容性比较好,支持IE8,以及其他的标准浏览器,IE8以下版本没有测试,IE8以上版本基本都支持,这种方法是通过js来调整iframe的宽高的,第二种方法很简单,是我看朋友是这样的写的,具体兼容性没有测试,应该不会差。不多少了,直接贴代码:
第一种:

<script type="text/javascript">
function findDimensions(){//函数:获取尺寸
var winWidth = 0;
var winHeight = 0;
//获取窗口宽度
if (window.innerWidth){
winWidth = window.innerWidth;
}else if ((document.body) && (document.body.clientWidth)){
winWidth = document.body.clientWidth;
}
//获取窗口高度
if (window.innerHeight){
winHeight = window.innerHeight;
}else if ((document.body) && (document.body.clientHeight)){
winHeight = document.body.clientHeight;
}
//通过深入Document内部对body进行检测,获取窗口大小
if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth){
winHeight = document.documentElement.clientHeight;
winWidth = document.documentElement.clientWidth;
}
//调整div的高度以及iframe的宽高
var iframehei = winHeight - 180;
var iframeWid = winWidth - 310;
document.getElementById("Conframe").style.height=iframehei+"px";
document.getElementById("Conframe").style.width=iframeWid+"px";
}

$(document).ready(function(){
findDimensions();
menuOnClick("homePage/homePage.do");
});
//调用函数,获取数值
$(window).resize(function(){
findDimensions();
});
</script>

第二种:

<iframe name="main" src="home.jsp" width=100% onload="this.height=this.contentWindow.document.body.scrollHeight" frameborder=No border=0 marginwidth=0 marginheight=0 scrolling=no></iframe>

(第二种是不是很简单?直接这样就行了)

onload="this.height=this.contentWindow.document.body.scrollHeight"

休假6446 发表于 2015-4-27 21:03:05

好帖要顶,楼主的头像还是不错滴http://forumimage.org/images/icon01.jpghttp://forumimage.org/images/icon02.jpghttp://forumimage.org/images/icon03.jpghttp://forumimage.org/images/icon04.jpghttp://forumimage.org/images/icon05.jpghttp://forumimage.org/images/icon06.jpghttp://forumimage.org/images/icon07.jpghttp://forumimage.org/images/icon08.jpghttp://forumimage.org/images/icon09.jpghttp://forumimage.org/images/icon10.jpghttp://forumimage.org/images/icon11.jpghttp://forumimage.org/images/icon12.jpghttp://forumimage.org/images/icon13.jpghttp://forumimage.org/images/icon14.jpghttp://forumimage.org/images/icon15.jpg

kaorou39 发表于 2015-5-26 11:32:47

好帖要顶,楼主的头像还是不错滴http://forumimage.org/images/icon01.jpghttp://forumimage.org/images/icon02.jpghttp://forumimage.org/images/icon03.jpghttp://forumimage.org/images/icon04.jpghttp://forumimage.org/images/icon05.jpghttp://forumimage.org/images/icon06.jpghttp://forumimage.org/images/icon07.jpghttp://forumimage.org/images/icon08.jpghttp://forumimage.org/images/icon09.jpghttp://forumimage.org/images/icon10.jpghttp://forumimage.org/images/icon11.jpghttp://forumimage.org/images/icon12.jpghttp://forumimage.org/images/icon13.jpghttp://forumimage.org/images/icon14.jpghttp://forumimage.org/images/icon15.jpg

fhuj3d96 发表于 2016-12-30 09:10:52

- -.......
南昌美容化妆培训 http://www.xszsz.com/
南昌美容化妆学校 http://www.xszsz.com/
南昌形象设计学校 http://www.xszsz.com/
南昌摄影培训 http://www.xszsz.com/
南昌摄影培训学校 http://www.xszsz.com/
南昌摄影培训班 http://www.xszsz.com/
南昌专业摄影培训 http://www.xszsz.com/

fhuj3d96 发表于 2017-1-14 05:46:53

超值强帖,帮你顶,^_^

fhuj3d96 发表于 2017-1-14 12:58:11

支持你加分
页: [1]
查看完整版本: iframe高度自适应方法,未