移动端适配

develop
Jmysy 2020-06-03 18:48:36 +08:00
parent 1945595232
commit 4bd482b6fa
3 changed files with 31 additions and 6 deletions

View File

@ -12,6 +12,20 @@
display: none!important;
}
.pe-collaspe{
position: absolute;
width: 50px;
height: 50px;
line-height: 50px;
background-color: #5FB878;
z-index: 9999;
right: 40px;
bottom: 25px;
border-radius: 50px;
text-align: center;
color: white;
}
/**
*
* */

View File

@ -205,20 +205,22 @@ layui.define(['table', 'jquery', 'element', 'form', 'pearTab', 'pearMenu', 'pear
this.menuSkin = function(theme) {
$(".pear-admin").removeClass("light-theme");
$(".pear-admin").removeClass("light-theme");
$(".pear-admin").removeClass("dark-theme");
$(".pear-admin").addClass(theme);
}
}
};
$("body").on("click", ".collaspe,.pear-cover", function() {
sideMenu.collaspe();
if ($(".pear-admin").is(".pear-mini")) {
$(".layui-icon-spread-left").addClass("layui-icon-shrink-right")
$(".layui-icon-spread-left").removeClass("layui-icon-spread-left")
$(".pear-admin").removeClass("pear-mini");
} else {
$(".layui-icon-shrink-right").addClass("layui-icon-spread-left")
$(".layui-icon-shrink-right").removeClass("layui-icon-shrink-right")
$(".pear-admin").addClass("pear-mini");
}
})
@ -248,9 +250,13 @@ layui.define(['table', 'jquery', 'element', 'form', 'pearTab', 'pearMenu', 'pear
function compatible() {
if ($(window).width() <= 768) {
sideMenu.collaspe();
if ($(".pear-admin").is(".pear-mini")) {
if ($(".pear-admin").is(".pear-mini")) {
$(".layui-icon-spread-left").addClass("layui-icon-shrink-right")
$(".layui-icon-spread-left").removeClass("layui-icon-spread-left")
$(".pear-admin").removeClass("pear-mini");
} else {
$(".layui-icon-shrink-right").addClass("layui-icon-spread-left")
$(".layui-icon-shrink-right").removeClass("layui-icon-shrink-right")
$(".pear-admin").addClass("pear-mini");
}
}

View File

@ -19,7 +19,7 @@
<div class="layui-layout layui-layout-admin">
<div class="layui-header">
<ul class="layui-nav layui-layout-left">
<li class="collaspe layui-nav-item"><a href="#" class="layui-icon layui-icon-shrink-right"></a></li>
<li class="collaspe layui-nav-item layui-hide-xs"><a href="#" class="layui-icon layui-icon-shrink-right"></a></li>
<li class="refresh layui-nav-item"><a href="#" class="layui-icon layui-icon-refresh-1"></a></li>
</ul>
<div id="control" class="layui-layout-control"></div>
@ -60,6 +60,11 @@
<div class="preloader">
<div class="preloader-inner"></div>
</div>
<!-- 移动端 的 收缩适配 -->
<div class="collaspe pe-collaspe layui-hide-sm">
<i class="layui-icon layui-icon-shrink-right"></i>
</div>
<script src="component/layui/layui.js"></script>
<script>