您好,欢迎访问一九零五行业门户网

让iframe自适应高度(支持XHTML,支持FF)_javascript技巧

先说明,这个办法只限于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。
其它类似信息

推荐信息