关于iframe内页高度自适应

您当前所在位置：首页 → 网络编程 → 网页设计 → 关于iframe内页高度自适应

关于iframe内页高度自适应 时间：2015/6/28来源：IT猫扑网作者：网管联盟我要评论(0)

　　做后台管理时候,经常用到在ifame里嵌入一个页面,但iframe高度不能随页面高度增加而增高.所以得借助JS解决.

　　在iframe内页里面欠入此段JS即可.

　1/**/////后台辅助
　2var　admin　=　{
　3　　　　//计算页面最大宽高值
　4　　　　size:　function()　{
　5　　　　　　　　var　a,　yc;
　6　　　　　　　　var　b,　wh,　pw,　ph;
　7　　　　　　　　a　=　window.innerHeight　&&　window.scrollMaxY　?　document.body.scrollWidth　:　document.body.scrollHeight　>　document.body.offsetHeight　?　document.body.scrollWidth　:　document.body.offsetWidth;
　8　　　　　　　　yc　=　window.innerHeight　&&　window.scrollMaxY　?　(window.innerHeight　+　window.scrollMaxY)　:　document.body.scrollHeight　>　document.body.offsetHeight　?　document.body.scrollHeight　:　document.body.offsetHeight;
　9　　　　　　　　b　=　self.innerHeight　?　self.innerWidth　:　document.documentElement　&&　document.documentElement.clientHeight　?　document.documentElement.clientWidth　:　document.body.clientWidth;
10　　　　　　　　wh　=　self.innerHeight　?　self.innerHeight　:　document.documentElement　&&　document.documentElement.clientHeight　?　document.documentElement.clientHeight　:　document.body.clientHeight;
11　　　　　　　　ph　=　yc　<　wh　?　wh　:　yc;
12　　　　　　　　pw　=　a　<　b　?　b　:　a;
13　　　　　　　　return　new　Array(pw,　ph,　a,　yc)
14　　　　},
15　　　　//增加监听事件
16　　　　addEvent:　function(o,　a,　b)　{
17　　　　　　　　o.attachEvent　?　o.attachEvent('on'　+　a,　function()　{
18　　　　　　　　　　　　b.call(o)
19　　　　　　　　})　:　o.addEventListener(a,　b,　false)
20　　　　},
21　　　　//iframe　跟其中内嵌页面高度重设iframe高度
22　　　　init:　function()　{
23　　　　　　　　var　o　=　admin.size();
24
25　　　　　　　　//这个ID是它上面包含它那个iframe的　　ID
26　　　　　　　　var　k　=　parent.document.getElementById('mainframe');
27　　　　　　　　if　(!k)　return;
28　　　　　　　　k.style.height　=　o[1]　+　'px';
29　　　　}
30}
31//为　window　对像增加一个方法（iframe高度重新计算）
32admin.addEvent(window,　'load',　admin.init);

关键词标签：iframe

相关阅读

文章评论

查看所有0条评论>>