shadeClose :true,
//点击背景关闭弹窗,true表示可关闭,false表示不可关闭
shade: [0.8, ‘#393D49’],
//自定义的遮幕层样式
若出现以上属性无效,即弹窗后背景没有什么改变,
可能和引用的layer.js和layer.css有关。
更新v3.1.1版本。
js文件:
/*! layer-v3.1.1 Web弹层组件 MIT License http://layer.layui.com/ By 贤心 */
;!function (e, t) {
"use strict";
var i, n, a = e.layui && layui.define, o = {
getPath: function () {
var e = document.currentScript ? document.currentScript.src : function () {
for (var e, t = document.scripts, i = t.length - 1, n = i; n > 0; n--) if ("interactive" === t[n].readyState) {
e = t[n].src;
break
}
return e || t[i].src
}();
return e.substring(0, e.lastIndexOf("/") + 1)
}(),
config: {
},
end: {
},
minIndex: 0,
minLeft: [],
btn: ["确定", "取消"],
type: ["dialog", "page", "iframe", "loading", "tips"],
getStyle: function (t, i) {
var n = t.currentStyle ? t.currentStyle : e.getComputedStyle(t, null);
return n[n.getPropertyValue ? "getPropertyValue" : "getAttribute"](i)
},
link: function (t, i, n) {
if (r.path) {
var a = document.getElementsByTagName("head")[0], s = document.createElement("link");
"string" == typeof i && (n = i);
var l = (n || t).replace(/\.|\//g, ""), f = "layuicss-" + l, c = 0;
s.rel = "stylesheet", s.href = r.path + t, s.id = f, document.getElementById(f) || a.appendChild(s), "function" == typeof i && !function u() {
return ++c > 80 ? e.console && console.error("layer.css: Invalid") : void (1989 === parseInt(o.getStyle(document.getElementById(f), "width")) ? i() : setTimeout(u, 100))
}()
}
}
}, r = {
v: "3.1.1", ie: function () {
var t = navigator.userAgent.toLowerCase();
return !!(e.ActiveXObject || "ActiveXObject" in e) && ((t.match(/msie\s(\d+)/) || [])[1] || "11")
}(), index: e.layer && e.layer.v ? 1e5 : 0, path: o.getPath, config: function (e, t) {
return e = e || {
}, r.cache = o.config = i.extend({
}, o.config, e), r.path = o.config.path || r.path, "string" == typeof e.extend && (e.extend = [e.extend]), o.config.path && r.ready(), e.extend ? (a ? layui.addcss("modules/layer/" + e.extend) : o.link("theme/" + e.extend), this) : this
}, ready: function (e) {
var t = "layer", i = "", n = (a ? "modules/layer/" : "theme/") + "default/layer.css?v=" + r.v + i;
return a ? layui.addcss(n, e, t) : o.link(n, e, t), this
}, alert: function (e, t, n) {
var a = "function" == typeof t;
return a && (n = t), r.open(i.extend({
content: e, yes: n}, a ? {
} : t))
}, confirm: function (e, t, n, a) {
var s = "function" == typeof t;
return s && (a = n, n = t), r.open(i.extend({
content: e, btn: o.btn, yes: n, btn2: a}, s ? {
} : t))
}, msg: function (e, n, a) {
var s = "function" == typeof n, f = o.config.skin, c = (f ? f + " " + f + "-msg" : "") || "layui-layer-msg",
u = l.anim.length - 1;
return s && (a = n), r.open(i.extend({
content: e,
time: 3e3,
shade: !1,
skin: c,
title: !1,
closeBtn: !1,
btn: !1,
resize: !1,
end: a
}, s && !o.config.skin ? {
skin: c + " layui-layer-hui", anim: u} : function () {
return n = n || {
}, (n.icon === -1 || n.icon === t && !o.config.skin) && (n.skin = c + " " + (n.skin || "layui-layer-hui")), n
}()))
}, load: function (e, t) {
return r.open(i.extend({
type: 3, icon: e || 0, resize: !1, shade: .01}, t))
}, tips: function (e, t, n) {
return r.open(i.extend({
type: 4,
content: [e, t],
closeBtn: !1,
time: 3e3,
shade: !1,
resize: !1,
fixed: !1,
maxWidth: 210
}, n))
}
}, s = function (e) {
var t = this;
t.index = ++r.index, t.config = i.extend({
}, t.config, o.config, e), document.body ? t.creat() : setTimeout(function () {
t.creat()
}, 30)
};
s.pt = s.prototype;
var l = ["layui-layer", ".layui-layer-title", ".layui-layer-main", ".layui-layer-dialog", "layui-layer-iframe", "layui-layer-content", "layui-layer-btn", "layui-layer-close"];
l.anim = ["layer-anim-00", "layer-anim-01", "layer-anim-02", "layer-anim-03", "layer-anim-04", "layer-anim-05", "layer-anim-06"], s.pt.config = {
type: 0,
shade: .3,
fixed: !0,
move: l[1],
title: "信息",
offset: "auto",
area: "auto",
closeBtn: 1,
time: 0,
zIndex: 19891014,
maxWidth: 360,
anim: 0,
isOutAnim: !0,
icon: -1,
moveType: 1,
resize: !0,
scrollbar: !0,
tips: 2
}, s.pt.vessel = function (e, t) {
var n = this, a = n.index, r = n.config, s = r.zIndex + a, f = "object" == typeof r.title,
c = r.maxmin && (1 === r.type || 2 === r.type),
u = r.title ? '<div class="layui-layer-title" style="' + (f ? r.title[1] : "") + '">' + (f ? r.title[0] : r.title) + "</div>" : "";
return r.zIndex = s, t([r.shade ? '<div class="layui-layer-shade" id="layui-layer-shade' + a + '" times="' + a + '" style="' + ("z-index:" + (s - 1) + "; ") + '"></div>' : "", '<div class="' + l[0] + (" layui-layer-" + o.type[r.type]) + (0 != r.type && 2 != r.type || r.shade ? "" : " layui-layer-border") + " " + (r.skin || "") + '" id="' + l[0] + a + '" type="' + o.type[r.type] + '" times="' + a + '" showtime="' + r.time + '" conType="' + (e ? "object" : "string") + '" style="z-index: ' + s + "; width:" + r.area[0] + ";height:" + r.area[1] + (r.fixed ? "" : ";position:absolute;") + '">' + (e && 2 != r.type ? "" : u) + '<div id="' + (r.id || "") + '" class="layui-layer-content' + (0 == r.type && r.icon !== -1 ? " layui-layer-padding" : "") + (3 == r.type ? " layui-layer-loading" + r.icon : "") + '">' + (0 == r.type && r.icon !== -1 ? '<i class="layui-layer-ico layui-layer-ico' + r.icon + '"></i>' : "") + (1 == r.type && e ? "" : r.content || "") + '</div><span class="layui-layer-setwin">' + function () {
var e = c ? '<a class="layui-layer-min" href="javascript:;"><cite></cite></a><a class="layui-layer-ico layui-layer-max" href="javascript:;"></a>' : "";
return r.closeBtn && (e += '<a class="layui-layer-ico ' + l[7] + " " + l[7] + (r.title ? r.closeBtn : 4 == r.type ? "1" : "2") + '" href="javascript:;"></a>'), e
}() + "</span>" + (r.btn ? function () {
var e = "";
"string" == typeof r.btn && (r.btn = [r.btn]);
for (var t = 0, i = r.btn.length; t < i; t++) e += '<a class="' + l[6] + t + '">' + r.btn[t] + "</a>";
return '<div class="' + l[6] + " layui-layer-btn-" + (r.btnAlign || "") + '">' + e + "</div>"
}() : "") + (r.resize ? '<span class="layui-layer-resize"></span>' : "") + "</div>"], u, i('<div class="layui-layer-move"></div>')), n
}, s.pt.creat = function () {
var e = this, t = e.config, a = e.index, s = t.content, f = "object" == typeof s, c = i("body");
if (!t.id || !i("#" + t.id)[0]) {
switch ("string" == typeof t.area && (t.area = "auto" === t.area ? ["", ""] : [t.area, ""]), t.shift && (t.anim = t.shift), 6 == r.ie && (t.fixed = !1), t.type) {
case 0:
t.btn = "btn" in t ? t.btn : o.btn[0], r.closeAll("dialog");
break;
case 2:
var s = t.content = f ? t.content : [t.content || "http://layer.layui.com", "auto"];
t.content = '<iframe scrolling="' + (t.content[1] || "auto") + '" allowtransparency="true" id="' + l[4] + a + '" name="' + l[4] + a + '" οnlοad="this.className=\'\';" class="layui-layer-load" frameborder="0" src="' + t.content[0] + '"></iframe>';
break;
case 3:
delete t.title, delete t.closeBtn, t.icon === -1 && 0 === t.icon, r.closeAll("loading");
break;
case 4:
f || (t.content = [t.content, "body"]), t.follow = t.content[1], t.content = t.content[0] + '<i class="layui-layer-TipsG"></i>', delete t.title, t.tips = "object" == typeof t.tips ? t.tips : [t.tips, !0], t.tipsMore || r.closeAll("tips")
}
if (e.vessel(f, function (n, r, u) {
c.append(n[0]), f ? function () {
2 == t.type || 4 == t.type ? function () {
i("body").append(n[1])
}() : function () {
s.parents("." + l[0])[0] || (s.data("display", s.css("display")).show().addClass("layui-layer-wrap").wrap(n[1]), i("#" + l[0] + a).find("." + l[5]).before(r))
}()
}() : c.append(n[1]), i(".layui-layer-move")[0] || c.append(o.moveElem = u), e.layero = i("#" + l[0] + a), t.scrollbar || l.html.css("overflow", "hidden").attr("layer-full", a)
}).auto(a), i("#layui-layer-shade" + e.index).css({
"background-color": t.shade[1] || "#000",
opacity: t.shade[0] || t.shade
}), 2 == t.type && 6 == r.ie && e.layero.find("iframe").attr("src", s[0]), 4 == t.type ? e.tips() : e.offset(), t.fixed && n.on("resize", function () {
e.offset(), (/^\d+%$/.test(t.area[0]) || /^\d+%$/.test(t.area[1])) && e.auto(a), 4 == t.type && e.tips()
}), t.time <= 0 || setTimeout(function () {
r.close(e.index)
}, t.time), e.move().callback(), l.anim[t.anim]) {
var u = "layer-anim " + l.anim[t.anim];
e.layero.addClass(u).one("webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend", function () {
i(this).removeClass(u)
})
}
t.isOutAnim && e.layero.data("