修复Layer全局污染的问题

修复错误提交的插件配置
修复iOS下页面底部点击的BUG
优化弹出窗无标题时关闭按钮的显示
pull/9/head
Karson 2017-08-15 16:58:28 +08:00
parent d7bc9ffcc2
commit 836eca5b68
8 changed files with 190 additions and 171 deletions

View File

@ -50,6 +50,13 @@ body.is-dialog {
/*width: 70%;*/ /*width: 70%;*/
max-width: 885px; max-width: 885px;
} }
/*iOS兼容*/
html.ios-fix,
html.ios-fix body {
height: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.content { .content {
min-height: 500px; min-height: 500px;
} }
@ -70,15 +77,6 @@ body.is-dialog {
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
.tab-addtabs.ios-iframe-fix .tab-pane {
-webkit-overflow-scrolling: touch;
overflow: auto;
}
.layui-layer-iframe .layui-layer-content.ios-iframe-fix {
-webkit-overflow-scrolling: touch;
overflow: auto;
overflow-y: auto!important;
}
@media only screen and (min-width: 481px) { @media only screen and (min-width: 481px) {
.row-flex { .row-flex {
display: flex; display: flex;
@ -576,59 +574,59 @@ table.table-template {
-moz-box-shadow: 0 0 3px #eee; -moz-box-shadow: 0 0 3px #eee;
box-shadow: 0 0 3px #eee; box-shadow: 0 0 3px #eee;
} }
.layui-layer-title { .layui-layer-fast {
/*自定义底部灰色操作区*/
}
.layui-layer-fast .layui-layer-title {
background: #2c3e50!important; background: #2c3e50!important;
color: #fff!important; color: #fff!important;
border-bottom: none;
} }
/*避免出现多滚动条*/ .layui-layer-fast .layui-layer-title ~ .layui-layer-setwin {
.layui-layer-noborder { top: 0px;
height: 42px;
}
.layui-layer-fast .layui-layer-title ~ .layui-layer-setwin > a {
height: 42px;
line-height: 42px;
display: inline-block;
}
.layui-layer-fast.layui-layer-border {
border: none!important; border: none!important;
box-shadow: 1px 1px 50px rgba(0, 0, 0, 0.3) !important; box-shadow: 1px 1px 50px rgba(0, 0, 0, 0.3) !important;
} }
.layui-layer-moves { .layui-layer-fast .layui-layer-moves {
-webkit-box-sizing: content-box; -webkit-box-sizing: content-box;
-moz-box-sizing: content-box; -moz-box-sizing: content-box;
box-sizing: content-box; box-sizing: content-box;
} }
.layui-layer-iframe { .layui-layer-fast .layui-layer-btn {
overflow: hidden!important;
}
.layui-layer-iframe .layui-layer-content {
-webkit-overflow-scrolling: touch;
overflow-y: hidden!important;
overflow: hidden;
}
/*自定义底部灰色操作区*/
.layui-layer-btn {
text-align: center!important; text-align: center!important;
padding: 10px!important; padding: 10px!important;
background: #ecf0f1; background: #ecf0f1;
} }
.layui-layer-footer { .layui-layer-fast .layui-layer-btn a {
background-color: #95a5a6!important;
border-color: #95a5a6!important;
color: #fff!important;
}
.layui-layer-fast .layui-layer-btn .layui-layer-btn0 {
background-color: #18bc9c!important;
border-color: #18bc9c!important;
}
.layui-layer-fast .layui-layer-footer {
padding: 8px 20px; padding: 8px 20px;
background-color: #ecf0f1; background-color: #ecf0f1;
height: auto; height: auto;
text-align: inherit!important; text-align: inherit!important;
} }
.layui-layer-btn a { .layui-layer-fast .layui-layer-setwin > a {
background-color: #95a5a6!important;
border-color: #95a5a6!important;
color: #fff!important;
}
.layui-layer-btn .layui-layer-btn0 {
background-color: #18bc9c!important;
border-color: #18bc9c!important;
}
.layui-layer-setwin {
top: 10px!important;
}
.layui-layer-setwin > a {
background: none!important; background: none!important;
} }
.layui-layer-setwin > a cite { .layui-layer-fast .layui-layer-setwin > a cite {
display: none; display: none;
} }
.layui-layer-setwin > a:after { .layui-layer-fast .layui-layer-setwin > a:after {
content: "\e625"; content: "\e625";
font-family: iconfont; font-family: iconfont;
font-style: normal; font-style: normal;
@ -640,31 +638,42 @@ table.table-template {
margin: 0; margin: 0;
z-index: 1; z-index: 1;
} }
.layui-layer-setwin > a:hover { .layui-layer-fast .layui-layer-setwin > a:hover {
text-decoration: none!important; text-decoration: none!important;
background: none!important; background: none!important;
} }
.layui-layer-setwin > a:focus { .layui-layer-fast .layui-layer-setwin > a:focus {
text-decoration: none!important; text-decoration: none!important;
} }
.layui-layer-setwin .layui-layer-min:after { .layui-layer-fast .layui-layer-setwin .layui-layer-min {
display: none;
}
.layui-layer-fast .layui-layer-setwin .layui-layer-min:after {
content: "\e625"; content: "\e625";
} }
.layui-layer-setwin .layui-layer-max:after { .layui-layer-fast .layui-layer-setwin .layui-layer-max {
display: none;
}
.layui-layer-fast .layui-layer-setwin .layui-layer-max:after {
content: "\e623"; content: "\e623";
} }
.layui-layer-setwin .layui-layer-maxmin:after { .layui-layer-fast .layui-layer-setwin .layui-layer-maxmin {
display: none;
}
.layui-layer-fast .layui-layer-setwin .layui-layer-maxmin:after {
content: "\e624"; content: "\e624";
} }
.layui-layer-setwin .layui-layer-close1:after { .layui-layer-fast .layui-layer-setwin .layui-layer-close1:after {
content: "\e626"; content: "\e626";
} }
.layui-layer-setwin .layui-layer-close2, .layui-layer-fast .layui-layer-setwin .layui-layer-close2,
.layui-layer-setwin .layui-layer-close2:hover { .layui-layer-fast .layui-layer-setwin .layui-layer-close2:hover {
background: url('../libs/layer/build/skin/default/icon.png') no-repeat -149px -31px !important; background: url('../libs/layer/build/skin/default/icon.png') no-repeat -149px -31px !important;
top: -30px;
right: -30px;
} }
.layui-layer-setwin .layui-layer-close2:after, .layui-layer-fast .layui-layer-setwin .layui-layer-close2:after,
.layui-layer-setwin .layui-layer-close2:hover:after { .layui-layer-fast .layui-layer-setwin .layui-layer-close2:hover:after {
display: none; display: none;
} }
@media (min-width: 768px) { @media (min-width: 768px) {

File diff suppressed because one or more lines are too long

View File

@ -66,6 +66,10 @@ define(['fast', 'moment'], function (Fast, Moment) {
}, },
init: function () { init: function () {
//公共代码 //公共代码
//添加ios-fix兼容iOS下的iframe
if(/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream){
$("html").addClass("ios-fix");
}
//配置Toastr的参数 //配置Toastr的参数
Toastr.options.positionClass = Config.controllername === 'index' ? "toast-top-right-index" : "toast-top-right"; Toastr.options.positionClass = Config.controllername === 'index' ? "toast-top-right-index" : "toast-top-right";
//点击包含.btn-dialog的元素时弹出dialog //点击包含.btn-dialog的元素时弹出dialog

View File

@ -181,11 +181,6 @@ define(['jquery', 'bootstrap', 'backend', 'addtabs', 'adminlte', 'form'], functi
//绑定tabs事件 //绑定tabs事件
$('#nav').addtabs({iframeHeight: "100%"}); $('#nav').addtabs({iframeHeight: "100%"});
//修复iOS下iframe无法滚动的BUG
if (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream) {
$(".tab-addtabs").addClass("ios-iframe-fix");
}
if ($("ul.sidebar-menu li.active a").size() > 0) { if ($("ul.sidebar-menu li.active a").size() > 0) {
$("ul.sidebar-menu li.active a").trigger("click"); $("ul.sidebar-menu li.active a").trigger("click");
} else { } else {

View File

@ -126,7 +126,6 @@ define(['jquery', 'bootstrap', 'toastr', 'layer', 'lang'], function ($, undefine
area: area, area: area,
content: url, content: url,
zIndex: Layer.zIndex, zIndex: Layer.zIndex,
skin: 'layui-layer-noborder',
success: function (layero, index) { success: function (layero, index) {
var that = this; var that = this;
//存储callback事件 //存储callback事件
@ -159,9 +158,9 @@ define(['jquery', 'bootstrap', 'toastr', 'layer', 'lang'], function ($, undefine
} }
} }
}, options ? options : {}); }, options ? options : {});
if (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream && top.$(".tab-pane.active").size() > 0) { if ($(window).width() < 480 || (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream && top.$(".tab-pane.active").size() > 0)) {
options.area = [top.$(".tab-pane.active").width() + "px", top.$(".tab-pane.active").height() + "px"]; options.area = [top.$(".tab-pane.active").width() + "px", top.$(".tab-pane.active").height() + "px"];
options.offset = [ top.$(".tab-pane.active").scrollTop() + "px", "0px"]; options.offset = [top.$(".tab-pane.active").scrollTop() + "px", "0px"];
} }
Layer.open(options); Layer.open(options);
return false; return false;
@ -205,7 +204,7 @@ define(['jquery', 'bootstrap', 'toastr', 'layer', 'lang'], function ($, undefine
if (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream) { if (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream) {
var titHeight = layero.find('.layui-layer-title').outerHeight() || 0; var titHeight = layero.find('.layui-layer-title').outerHeight() || 0;
var btnHeight = layero.find('.layui-layer-btn').outerHeight() || 0; var btnHeight = layero.find('.layui-layer-btn').outerHeight() || 0;
$("iframe", layero).parent().addClass("ios-iframe-fix").css("height", layero.height() - titHeight - btnHeight); $("iframe", layero).parent().css("height", layero.height() - titHeight - btnHeight);
$("iframe", layero).css("height", "100%"); $("iframe", layero).css("height", "100%");
} }
}, },
@ -282,6 +281,9 @@ define(['jquery', 'bootstrap', 'toastr', 'layer', 'lang'], function ($, undefine
setting.url = Fast.api.fixurl(setting.url); setting.url = Fast.api.fixurl(setting.url);
} }
}); });
Layer.config({
skin: 'layui-layer-fast'
});
// 绑定ESC关闭窗口事件 // 绑定ESC关闭窗口事件
$(window).keyup(function (e) { $(window).keyup(function (e) {
if (e.keyCode == 27) { if (e.keyCode == 27) {

View File

@ -2051,7 +2051,6 @@ define('fast',['jquery', 'bootstrap', 'toastr', 'layer', 'lang'], function ($, u
area: area, area: area,
content: url, content: url,
zIndex: Layer.zIndex, zIndex: Layer.zIndex,
skin: 'layui-layer-noborder',
success: function (layero, index) { success: function (layero, index) {
var that = this; var that = this;
//存储callback事件 //存储callback事件
@ -2084,9 +2083,9 @@ define('fast',['jquery', 'bootstrap', 'toastr', 'layer', 'lang'], function ($, u
} }
} }
}, options ? options : {}); }, options ? options : {});
if (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream && top.$(".tab-pane.active").size() > 0) { if ($(window).width() < 480 || (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream && top.$(".tab-pane.active").size() > 0)) {
options.area = [top.$(".tab-pane.active").width() + "px", top.$(".tab-pane.active").height() + "px"]; options.area = [top.$(".tab-pane.active").width() + "px", top.$(".tab-pane.active").height() + "px"];
options.offset = [ top.$(".tab-pane.active").scrollTop() + "px", "0px"]; options.offset = [top.$(".tab-pane.active").scrollTop() + "px", "0px"];
} }
Layer.open(options); Layer.open(options);
return false; return false;
@ -2130,7 +2129,7 @@ define('fast',['jquery', 'bootstrap', 'toastr', 'layer', 'lang'], function ($, u
if (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream) { if (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream) {
var titHeight = layero.find('.layui-layer-title').outerHeight() || 0; var titHeight = layero.find('.layui-layer-title').outerHeight() || 0;
var btnHeight = layero.find('.layui-layer-btn').outerHeight() || 0; var btnHeight = layero.find('.layui-layer-btn').outerHeight() || 0;
$("iframe", layero).parent().addClass("ios-iframe-fix").css("height", layero.height() - titHeight - btnHeight); $("iframe", layero).parent().css("height", layero.height() - titHeight - btnHeight);
$("iframe", layero).css("height", "100%"); $("iframe", layero).css("height", "100%");
} }
}, },
@ -2207,6 +2206,9 @@ define('fast',['jquery', 'bootstrap', 'toastr', 'layer', 'lang'], function ($, u
setting.url = Fast.api.fixurl(setting.url); setting.url = Fast.api.fixurl(setting.url);
} }
}); });
Layer.config({
skin: 'layui-layer-fast'
});
// 绑定ESC关闭窗口事件 // 绑定ESC关闭窗口事件
$(window).keyup(function (e) { $(window).keyup(function (e) {
if (e.keyCode == 27) { if (e.keyCode == 27) {
@ -6775,6 +6777,10 @@ define('backend',['fast', 'moment'], function (Fast, Moment) {
}, },
init: function () { init: function () {
//公共代码 //公共代码
//添加ios-fix兼容iOS下的iframe
if(/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream){
$("html").addClass("ios-fix");
}
//配置Toastr的参数 //配置Toastr的参数
Toastr.options.positionClass = Config.controllername === 'index' ? "toast-top-right-index" : "toast-top-right"; Toastr.options.positionClass = Config.controllername === 'index' ? "toast-top-right-index" : "toast-top-right";
//点击包含.btn-dialog的元素时弹出dialog //点击包含.btn-dialog的元素时弹出dialog

View File

@ -2063,7 +2063,6 @@ define('fast',['jquery', 'bootstrap', 'toastr', 'layer', 'lang'], function ($, u
area: area, area: area,
content: url, content: url,
zIndex: Layer.zIndex, zIndex: Layer.zIndex,
skin: 'layui-layer-noborder',
success: function (layero, index) { success: function (layero, index) {
var that = this; var that = this;
//存储callback事件 //存储callback事件
@ -2096,9 +2095,9 @@ define('fast',['jquery', 'bootstrap', 'toastr', 'layer', 'lang'], function ($, u
} }
} }
}, options ? options : {}); }, options ? options : {});
if (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream && top.$(".tab-pane.active").size() > 0) { if ($(window).width() < 480 || (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream && top.$(".tab-pane.active").size() > 0)) {
options.area = [top.$(".tab-pane.active").width() + "px", top.$(".tab-pane.active").height() + "px"]; options.area = [top.$(".tab-pane.active").width() + "px", top.$(".tab-pane.active").height() + "px"];
options.offset = [ top.$(".tab-pane.active").scrollTop() + "px", "0px"]; options.offset = [top.$(".tab-pane.active").scrollTop() + "px", "0px"];
} }
Layer.open(options); Layer.open(options);
return false; return false;
@ -2142,7 +2141,7 @@ define('fast',['jquery', 'bootstrap', 'toastr', 'layer', 'lang'], function ($, u
if (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream) { if (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream) {
var titHeight = layero.find('.layui-layer-title').outerHeight() || 0; var titHeight = layero.find('.layui-layer-title').outerHeight() || 0;
var btnHeight = layero.find('.layui-layer-btn').outerHeight() || 0; var btnHeight = layero.find('.layui-layer-btn').outerHeight() || 0;
$("iframe", layero).parent().addClass("ios-iframe-fix").css("height", layero.height() - titHeight - btnHeight); $("iframe", layero).parent().css("height", layero.height() - titHeight - btnHeight);
$("iframe", layero).css("height", "100%"); $("iframe", layero).css("height", "100%");
} }
}, },
@ -2219,6 +2218,9 @@ define('fast',['jquery', 'bootstrap', 'toastr', 'layer', 'lang'], function ($, u
setting.url = Fast.api.fixurl(setting.url); setting.url = Fast.api.fixurl(setting.url);
} }
}); });
Layer.config({
skin: 'layui-layer-fast'
});
// 绑定ESC关闭窗口事件 // 绑定ESC关闭窗口事件
$(window).keyup(function (e) { $(window).keyup(function (e) {
if (e.keyCode == 27) { if (e.keyCode == 27) {

View File

@ -70,7 +70,12 @@ body.is-dialog {
/*width: 70%;*/ /*width: 70%;*/
max-width:885px; max-width:885px;
} }
/*iOS兼容*/
html.ios-fix,html.ios-fix body {
height: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.content { .content {
min-height:500px; min-height:500px;
} }
@ -90,18 +95,8 @@ body.is-dialog {
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
&.ios-iframe-fix{
.tab-pane {
-webkit-overflow-scrolling:touch;
overflow: auto;
}
}
}
.layui-layer-iframe .layui-layer-content.ios-iframe-fix {
-webkit-overflow-scrolling: touch;
overflow: auto;
overflow-y: auto!important;
} }
@media only screen and (min-width : 481px) { @media only screen and (min-width : 481px) {
.row-flex { .row-flex {
display: flex; display: flex;
@ -603,104 +598,110 @@ table.table-template{
.box-shadow(0 0 3px #eee); .box-shadow(0 0 3px #eee);
} }
} }
.layui-layer-fast {
.layui-layer-title { .layui-layer-title {
background:#2c3e50!important; background:#2c3e50!important;
color:#fff!important; color:#fff!important;
} border-bottom:none;
//只有当包含layui-layer-title标题时才显示按钮
/*避免出现多滚动条*/ ~.layui-layer-setwin{
.layui-layer-noborder { top: 0px;
border:none!important; height:42px;
box-shadow: 1px 1px 50px rgba(0,0,0,.3)!important; > a{
} height:42px;
.layui-layer-moves{ line-height:42px;
.box-sizing(content-box); display:inline-block;
} }
.layui-layer-iframe {
overflow:hidden!important;
}
.layui-layer-iframe .layui-layer-content {
-webkit-overflow-scrolling: touch;
overflow-y: hidden!important;
overflow:hidden;
}
/*自定义底部灰色操作区*/
.layui-layer-btn {
text-align: center!important;
padding: 10px!important;
background: #ecf0f1;
}
.layui-layer-footer {
padding:8px 20px;
background-color:#ecf0f1;
height:auto;
text-align:inherit!important;
}
.layui-layer-btn a {
background-color: #95a5a6!important;
border-color: #95a5a6!important;
color:#fff!important;
}
.layui-layer-btn .layui-layer-btn0{
background-color: #18bc9c!important;
border-color: #18bc9c!important;
}
.layui-layer-setwin {
top:10px!important;
> a {
background:none!important;
cite {
display:none;
} }
&:after { }
content: "\e625";
font-family: iconfont; &.layui-layer-border {
font-style: normal; border:none!important;
font-weight: normal; box-shadow: 1px 1px 50px rgba(0,0,0,.3)!important;
text-decoration: inherit; }
position: absolute; .layui-layer-moves{
font-size: 18px; .box-sizing(content-box);
color: #fff; }
margin: 0; /*自定义底部灰色操作区*/
z-index: 1; .layui-layer-btn {
text-align: center!important;
padding: 10px!important;
background: #ecf0f1;
a {
background-color: #95a5a6!important;
border-color: #95a5a6!important;
color:#fff!important;
} }
&:hover { .layui-layer-btn0{
text-decoration: none!important; background-color: #18bc9c!important;
border-color: #18bc9c!important;
}
}
.layui-layer-footer {
padding:8px 20px;
background-color:#ecf0f1;
height:auto;
text-align:inherit!important;
}
.layui-layer-setwin {
> a {
background:none!important; background:none!important;
cite {
display:none;
}
&:after {
content: "\e625";
font-family: iconfont;
font-style: normal;
font-weight: normal;
text-decoration: inherit;
position: absolute;
font-size: 18px;
color: #fff;
margin: 0;
z-index: 1;
}
&:hover {
text-decoration: none!important;
background:none!important;
}
&:focus {
text-decoration: none!important;
}
} }
&:focus { .layui-layer-min{
text-decoration: none!important;
}
}
.layui-layer-min{
&:after {
content: "\e625";
}
}
.layui-layer-max{
&:after {
content: "\e623";
}
}
.layui-layer-maxmin{
&:after {
content: "\e624";
}
}
.layui-layer-close1{
&:after {
content: "\e626";
}
}
.layui-layer-close2,.layui-layer-close2:hover{
background:url('../libs/layer/build/skin/default/icon.png') no-repeat -149px -31px !important;
&:after {
display:none; display:none;
&:after {
content: "\e625";
}
}
.layui-layer-max{
display:none;
&:after {
content: "\e623";
}
}
.layui-layer-maxmin{
display:none;
&:after {
content: "\e624";
}
}
.layui-layer-close1{
&:after {
content: "\e626";
}
}
//样式二关闭按钮
.layui-layer-close2,.layui-layer-close2:hover{
background:url('../libs/layer/build/skin/default/icon.png') no-repeat -149px -31px !important;
top:-30px;
right:-30px;
&:after {
display:none;
}
} }
} }
} }