动态的改变iframe的高度,实现iframe自动伸展,父页面也自动神缩
原理: 在iframe子页面一加载的时候,调用父iframe对象,改变其高度
具体实现一:
1、在iframe的具体页面(就是子页面),添加javascript
复制代码 代码如下:
2、在iframe的具体页面(就是子页面)的body中,添加onload事件
复制代码 代码如下:
3、为父页面的iframe标签添加id,即上面第一步,方法体中的第2行所写到的childframe
复制代码 代码如下:
framespacing=0 marginheight=0
src=frame1.jsp frameborder=0
noresize scrolling=no width=100% height=100% vspale=0 id=childframe>
具体实现二:
复制代码 代码如下:
//动态改变父类iframe的高度
//iframe页面调用的js
$(function(){
//取到窗口的高度
var winh = $(window).height();
//取到页面的高度
var bodyh = $(document).height();
if(bodyh > winh){
window.parent.document.getelementbyid(mainframe).height=bodyh;
}else{
window.parent.document.getelementbyid(mainframe).height=winh;
}
});
父页面的iframe为
复制代码 代码如下: