用法:EasyMask.init({ 300, height: 205, title: '帮助订阅', detail: '层里显示内容', opacity: 3, molor: '#000', bgcolor: '#7D0000' });
关闭窗口:EasyMask.close();
演示: 击点查看演示
参数说明：
- width，height：很明显，不说
- title：标题
- detail：显示内容
- opacity：透明层透明度：1~10
- molor：透明层颜色
- bgcolor：窗体主色
Code1
var EasyMask = 
{2
init: function() {3
document.body.style.overflow = eval((document.documentElement.offsetWidth) ? "document.documentElement" : "document.body").style.overflow = "hidden";4
var $ = function(v) { return document.getElementById(v); };5
var k = function(i, v) { return $(i) ? $(i) : v ? document.createElement("div") : document.createElement("iframe"); };6
var a = arguments.length ? arguments[0] : new Object;7
var h = window.innerHeight || self.innerHeight || (document.documentElement && document.documentElement.clientHeight && document.documentElement.offsetHeight) || document.body.clientHeight;8
var w = window.innerWidth || self.innerWidth || (document.documentElement && document.documentElement.clientWidth && document.documentElement.offsetWidth) || document.body.clientWidth;9
var t = document.documentElement.scrollTop;10
var l = document.documentElement.scrollLeft;11
var o = a.opacity ? a.opacity : 5;12
var m = a.molor ? a.molor : 'black';13
var e = a.width ? a.width < 300 ? 300 : a.width : 300;14
var f = a.height ? a.height < 200 ? 200 : a.height : 200;15
var b = a.bgcolor ? a.bgcolor : "#7D0000";16
var c = k("resourceMasks", true);17
var z = k("resourceContents", true);18
var s = k("resourceHideSelect", false);19
var g = k("resourceShadows", true);20
var top = (h - f) / 2 + t;21
var left = (w - e) / 2;22
c.id = "resourceMasks";23
c.onclick = EasyMask.close;24
c.style.cssText = "position:absolute;left:0;top:" + t + "px;" + w + "px;height:" + h + "px;background:" + m + ";z-index:999998;filter:alpha(opacity=" + o + "0);opacity:0." + o + ";";25
z.id = "resourceContents";26
z.style.cssText = 'background:#fff;border:1px solid ' + b + ';z-index:999999;position:absolute;' + e + 'px;height:' + f + 'px;top:' + top + 'px;left:' + left + 'px;';27
var i = '<div style="height:25px;background:' + b + ';color:#fff;font:bold 12px/25px Arial;text-indent:6px;overflow:hidden;padding-right:8px;position:relative;">' + (a.title ? a.title : "") + '<span style="position:absolute;right:0;top:0px;cursor:pointer;padding:0 6px 0 3px;" onmouseover="this.style.color=\'red\';" onmouseout="this.style.color=\'#fff\';" title="关闭" onclick="EasyMask.close()">X</span></div>';28
i += '<div style="padding:6px;position:relative;">' + (a.detail ? a.detail : "") + '</div>';29
z.innerHTML = i;30
s.id = "resourceHideSelect";31
s.style.cssText = "height:" + h + "px;" + w + "px;z-index:999997;position:absolute;top:0;left:0;background:#fff;border:0;filter:alpha(opacity=0);opacity:0;";32
g.id = "resourceShadows";33
g.style.cssText = 'background:#000;z-index:999996;position:absolute;' + e + 'px;height:' + f + 'px;top:' + (top + 6) + 'px;left:' + (left + 6) + 'px;filter:alpha(opacity=30);opacity:0.3;';34
EasyMask.app(s)(c)(z)(g);35
},36
close: function() {37
document.body.style.overflow = eval((document.documentElement.offsetWidth) ? "document.documentElement" : "document.body").style.overflow = "auto";38
EasyMask.del('resourceMasks', 'resourceContents', 'resourceHideSelect', 'resourceShadows');39
},40
app: function(v) {41
document.body.appendChild(v);42
return EasyMask.app;43
},44
del: function() {45
for (var i = 0; i < arguments.length; i++) {46
var id = document.getElementById(arguments[i]);47
id && id.parentNode.removeChild(id);48
}49
}50
}