修改BUG:iOS小屏设备竖屏时打开侧边栏菜单,后背景过长导致菜单无法完全遮盖住背景内容

This commit is contained in:
Argo-Lenovo 2016-11-19 13:49:00 +08:00
parent ff7517cfd2
commit a845699333
4 changed files with 20 additions and 16 deletions

View File

@ -26,6 +26,10 @@
margin-left: 0; margin-left: 0;
} }
#main-content.open {
display: none;
}
.modal-dialog { .modal-dialog {
width: 540px; width: 540px;
margin: 20px auto; margin: 20px auto;

View File

@ -131,14 +131,10 @@
text-align: left; text-align: left;
} }
.sidebar-closed #main-content { #main-content.closed {
margin-left: 0; margin-left: 0;
} }
.sidebar-closed #sidebar {
display: none !important;
}
#sidebar { #sidebar {
width: 210px; width: 210px;
height: auto; height: auto;

View File

@ -1,4 +1,7 @@
$(function () { $(function () {
var $sidebar = $("#sidebar");
var $main = $('#main-content');
$('#nav-accordion').dcAccordion({ $('#nav-accordion').dcAccordion({
eventType: 'click', eventType: 'click',
autoClose: true, autoClose: true,
@ -20,21 +23,22 @@
$('#websiteFooter').text($('#footer').val()); $('#websiteFooter').text($('#footer').val());
$('#sidebar').on('click', 'a', function () { $sidebar.on('click', 'a', function () {
var o = ($(this).offset()); var o = ($(this).offset());
diff = 300 - o.top; diff = 300 - o.top;
if (diff > 0) if (diff > 0)
$("#sidebar").scrollTo("-=" + Math.abs(diff), 500); $sidebar.scrollTo("-=" + Math.abs(diff), 500);
else else
$("#sidebar").scrollTo("+=" + Math.abs(diff), 500); $sidebar.scrollTo("+=" + Math.abs(diff), 500);
}); });
$('.sidebar-toggle-box').click(function () { $('.sidebar-toggle-box').on('click', function () {
if ($('#sidebar').is(":visible") === true) { if ($sidebar.is(":visible") === true) {
$(".sidebar").addClass("sidebar-closed"); $sidebar.hide();
$main.addClass('closed').removeClass('open');
} else { } else {
$(".sidebar").removeClass("sidebar-closed"); $sidebar.show();
$("#sidebar").show(); $main.addClass('open').removeClass('closed');
} }
}); });

View File

@ -18,7 +18,7 @@
<script src="~/Content/js/framework.js"></script> <script src="~/Content/js/framework.js"></script>
@RenderSection("Javascript", false) @RenderSection("Javascript", false)
} }
<section class="sidebar"> <section>
@RenderSection("header", false) @RenderSection("header", false)
@RenderSection("navigator", false) @RenderSection("navigator", false)
<section id="main-content"> <section id="main-content">