先说明,这个办法只限于iframe中的子页面也是本地页面(不能引用外网页面)
======方法=====
第一步 js部分
function getsize() {
var xscroll, yscroll;
if (window.innerheight && window.scrollmaxy) {
xscroll = document.body.scrollwidth;
yscroll = window.innerheight + window.scrollmaxy;
} else if (document.body.scrollheight > document.body.offsetheight){ // all but explorer mac
xscroll = document.body.scrollwidth;
yscroll = document.body.scrollheight;
} else { // explorer mac...would also work in explorer 6 strict, mozilla and safari
xscroll = document.body.offsetwidth;
yscroll = document.body.offsetheight;
}
var windowwidth, windowheight;
if (self.innerheight) { // all except explorer
windowwidth = self.innerwidth;
windowheight = self.innerheight;
} else if (document.documentelement && document.documentelement.clientheight) { // explorer 6 strict mode
windowwidth = document.documentelement.clientwidth;
windowheight = document.documentelement.clientheight;
} else if (document.body) { // other explorers
windowwidth = document.body.clientwidth;
windowheight = document.body.clientheight;
}
// for small pages with total height less then height of the viewport
if(yscroll pageheight = windowheight;
y = pageheight;
} else {
pageheight = yscroll;
y = pageheight;
}
if(xscroll pagewidth = windowwidth;
} else {
pagewidth = xscroll;
}
arraypagesize = new array(pagewidth,pageheight,windowwidth,windowheight)
return arraypagesize;
}
这段代码用来获取目标页的参数,包括页面高、宽,屏幕高、宽
function autoheight(pid) {
var x = new getsize();
parent.document.getelementbyid(pid).height=x[1];
}
这段代码用来实现父页面中iframe的高度自适应
\\\\\\\\\\
第二步 页面部分
这是父页面的iframe,没什么特别的,和普通的iframe一样,不过要设置好id值,以便子页面的参数调用。
在body中利用onload事件,将自身的高度传给父页面的iframe。