1、在文件夹里创建两个html文件,一个“index”一个“iframe”。
2、在index中添加一个iframe标签,直接嵌入iframe页面。
3、在iframe网页中添加了两个固定高度的div内容。
4、浏览器打开index页面我们发现iframe部分有滚动条,需要滚动显示页面。
5、现在我们在index页面的iframe标签再添加如下的属性。
6、再次打开index页面iframe已经高度自适应了。
宽度可以设置100%但高度用不行了,~ 可以通过jquery获取下父级的高度,赋值给iframe $(ifra
iframe高度自适应,700为自己设定的iframe高度最低值,高度小于700的将以700显示,大于700将以div自身高度来显示。iframe高度最低值可以自己修改
iframe高度自适应,700为自己设定的iframe高度最低值,高度小于700的将以700显示,大于700将以div自身高度来显示。iframe高度最低值可以自己修改
其他地方找来的自适应窗口高度,宽度应该100%就没事了。
先在iframe放一句onload,以便一打开就适应大小
然后添加一段JS代码,就是那个onload事件响应的function
function changeFrameHeight(){
var ifm= document.getElementById("iframepage");
ifm.height=document.documentElement.clientHeight;
}
下面这个也放进JS代码,窗口ReSize事件的时候重新设定高度
window.onresize=function(){
changeFrameHeight();
}
clientHeight是整个窗口可显示内容的高度,如果不止一个iframe或者还有div等容器,可以用clientHeight减掉其他容器的高度。
Win7 IE11测试没问题