程序博客网 > java im系统

动态的改变IFrame的高度

来源：互联网发布：java im系统编辑：程序博客网时间：2024/06/05 18:42

动态的改变IFrame的高度，实现IFrame自动伸展，父页面也自动神缩
原理：在IFrame子页面一加载的时候，调用父IFrame对象，改变其高度
具体实现一:
1、在IFrame的具体页面(就是子页面)，添加JavaScript

<script>
function IFrameResize(){
//alert(this.document.body.scrollHeight); //弹出当前页面的高度
var obj = parent.document.getElementById("childFrame"); //取得父页面IFrame对象
//alert(obj.height); //弹出父页面中IFrame中设置的高度
obj.height = this.document.body.scrollHeight; //调整父页面中IFrame的高度为此页面的高度
}
</script>

2、在IFrame的具体页面(就是子页面)的body中，添加onload事件

<body onload="IFrameResize()">

3、为父页面的IFrame标签添加ID，即上面第一步，方法体中的第2行所写到的childFrame

<IFRAME border=0 marginWidth=0
frameSpacing=0 marginHeight=0
src="frame1.jsp" frameBorder=0
noResize scrolling="no" width=100% height=100% vspale="0" id="childFrame"></IFRAME>

具体实现二

//动态改变父类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为

<iframe src="main.action" height="700" frameborder="0" width="100%" id="mainFrame" name="mainFrame"></iframe>

0 0

java im系统

java im系统

原创粉丝点击

热门问题 老师的惩罚人脸识别我在镇武司摸鱼那些年重生之率土为王我在大康的咸鱼生活盘龙之生命进化天生仙种凡人之先天五行春回大明朝姑娘不必设防，我是瞎子怎样购买海参干海参鲜海参干海参即食海参即食海参干海参野生海参和养殖海参鲜海参干海参干海参鲜海参干海参湿海参盐渍海参和半干海参买海参买怎么样买海参购买新鲜海参买海参那里买怎么买到好海参海参在哪买到那有卖海参的海参特惠那里卖的海参好海参哪里买的假海参干货的买那种海参好海参哪里有买的新鲜的海参哪里买上哪里买海参好大连辽参价格哪里买到好的海参买海苔老板海苔海苔功效夹心海苔紫菜和海苔海苔做法女生吃海苔有什么好处海苔亿万富翁夹心海苔做法海苔一天吃多少合适大连买海鲜去哪里买海鲜哪个网站好大连买海鲜三亚哪里买海鲜便宜北海去哪里买海鲜便宜