如何讓iframe網頁自適應高度?
來源:程序員人生 發布時間:2014-05-13 09:33:35 閱讀次數:4614次
網(LieHuo.Net)教程 做后臺管理時候,經常用到在ifame里嵌入一個頁面,但iframe高度不能隨頁面高度增加而增高.所以得借助JS解決. 在iframe內頁里面欠入此段JS即可.
以下為引用的內容: ////后臺輔助 var admin = { //計算頁面最大寬高值 size: function() { var a, yc; var b, wh, pw, ph; a = window.innerHeight && window.scrollMaxY ? document.body.scrollWidth : document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollWidth : document.body.offsetWidth; yc = window.innerHeight && window.scrollMaxY ? (window.innerHeight + window.scrollMaxY) : document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight; b = self.innerHeight ? self.innerWidth : document.documentElement && document.documentElement.clientHeight ? document.documentElement.clientWidth : document.body.clientWidth; wh = self.innerHeight ? self.innerHeight : document.documentElement && document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight; ph = yc < wh ? wh : yc; pw = a < b ? b : a; return new Array(pw, ph, a, yc) }, //增加監聽事件 addEvent: function(o, a, b) { o.attachEvent ? o.attachEvent('on' + a, function() { b.call(o) }) : o.addEventListener(a, b, false) }, //iframe 跟其中內嵌頁面高度重設iframe高度 init: function() { var o = admin.size(); //這個ID是它上面包含它那個iframe的 ID var k = parent.document.getElementById('mainframe'); if (!k) return; k.style.height = o[1] + 'px'; } } //為 window 對像增加一個方法(iframe高度重新計算) admin.addEvent(window, 'load', admin.init); |
最后看一下演示:
提示:可修改后代碼再運行!
生活不易,碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈