1、mzone.cc.js文件，用来创建基于命名空间的对象
| 代码如下 | 复制代码 |
|
function mzone(){}; /**
* Desc : 使用给定的对象路径进行对象的创建
* Para : objPath - 对象路径，字符串类型，格式为：xx.yy.zz
* Return : 没有返回值,创建成功后直接使用对象路径即可
*/ mzone.createObject = function(/*string*/objPath) {
if (!objPath || typeof(objPath) != 'string') return;
var root = window;
var parts = objPath.split('.');
for (var i = 0; i < parts.length; i ++) {
if (typeof(root[parts[i]]) == 'undefined') root[parts[i]] = {};
root = root[parts[i]];
}
}; |
|
2、mzone.cc.iframe.js文件，iframe的自动高度调整
* Title : iframe高度自动调整，适应各个浏览器（IE、Firefox、Chrome等）.需要注意的是在chrome下测试时必须在web容器中测试
| 代码如下 | 复制代码 |
|
mzone.createObject("mzone.cc.iframe"); /**
* Desc : 定义对象mzone.cc.iframe的静态方法实现iframe动态调整
* Para : iframe - 要调整的iframe对象，DOM对象
* extHeight - 自动计算iframe的高度后额外增加的高度值，数字型
* minHeight - iframe的最小高度，数字型
* Return : 没有返回值
*/
mzone.cc.iframe.autoHeight = function(/*object*/iframe, /*int*/extHeight, /*int*/minHeight) {
iframe.style.display = "block";
if (iframe.contentDocument && iframe.contentDocument.body.offsetHeight) { // ff,chrome等
var h = parseInt(iframe.contentDocument.body.offsetHeight) + 50;
h += extHeight;
if (h < minHeight) h = minHeight;
iframe.height = h + "px";
} else if (iframe.Document && iframe.Document.body.scrollHeight) { // IE
var h = parseInt(iframe.Document.body.scrollHeight) + 35;
h += extHeight;
if (h < minHeight) h = minHeight;
iframe.height = h + "px";
} else {
var h = parseInt(iframe.contentWindow.document.documentElement.scrollHeight) + 35;
h += extHeight;
if (h < minHeight) h = minHeight;
iframe.height = h + "px";
}
} |
|
将以上两个js保存并引入到页面中就可以按照如下方法调用实现iframe的高度自动调整了：
| 代码如下 | 复制代码 |
|
var iframe = document.getElementById("iframe_body"); // iframe对象
var extHeight = 0; // 要额外增加的iframe的高度值
var minHeight = 300; // iframe的最小高度设置 mzone.cc.iframe.autoHeight(iframe, extHeight, minHeight); |
|
以上脚本在IE、Firefox和Chrome下都测试通过，需要注意的是在google的Chrome浏览器中离线测试时是有错误的，需要在web容器（如apache或IIS）中进行测试才能够看到效果。