修改BUG：移动端菜单管理页面子页面选择父级菜单，窗口太靠下，出现滚动条

Bootstrap.Admin/Content/fa.css

@@ -8,7 +8,6 @@
 }
 
 .fa-target {
-    height: 16px;
     display: block;
 }
 
@@ -85,14 +84,12 @@
     }
 
     .icon-content .modal-body {
-        position: fixed;
-        left: 18px;
-        right: 16px;
-        top: 62px;
-        bottom: 80px;
+        position: absolute;
+        left: 0;
+        right: 0;
+        top: 46px;
+        bottom: 65px;
         overflow: auto;
-        max-height: inherit;
-        height: inherit;
         -webkit-overflow-scrolling: touch;
     }
 
@@ -106,10 +103,10 @@
             }
 
     .icon-content .modal-footer {
-        position: fixed;
-        left: 16px;
-        right: 16px;
-        bottom: 15px;
+        position: absolute;
+        left: 0;
+        right: 0;
+        bottom: 0;
         white-space: nowrap;
     }
 
@@ -131,6 +128,27 @@
             border-radius: 4px;
         }
 
+        .icon-content .modal-footer span {
+            display: none;
+        }
+
+    .icon-content .dd {
+        max-width: 100%;
+        margin-bottom: 20px;
+    }
+
+.modal .modal-dialog .menu-content {
+    position: static;
+}
+
+    .modal .modal-dialog .menu-content .modal-body {
+        position: static;
+    }
+
+    .modal .modal-dialog .menu-content .modal-footer {
+        position: static;
+    }
+
 .fontawesome-icon-list .fa-hover a {
     overflow: hidden;
     text-overflow: ellipsis;
@@ -200,25 +218,6 @@
             margin-right: 10px;
         }
 
-.menu-content {
-    display: none;
-    z-index: 1051;
-}
-
-    .menu-content .modal-body {
-        overflow-y: auto;
-        max-height: 180px;
-        padding-bottom: 15px;
-    }
-
-    .menu-content .dd {
-        max-width: inherit;
-    }
-
-.icon-content .modal-footer span {
-    display: none;
-}
-
 @media (min-width: 375px) {
     .icon-content .modal-footer span {
         display: inline-block;
@@ -238,40 +237,30 @@
     .fa-icons {
         margin-right: 160px;
     }
-}
 
-@media (min-height: 375px) {
-    .menu-content .modal-body {
-        max-height: 240px;
+    .icon-content.menu-content {
+        top: 0;
+        right: auto;
+        bottom: 0;
+        left: auto;
+        width: 600px;
     }
 }
 
-@media (min-height: 414px) {
-    .menu-content .modal-body {
-        max-height: 280px;
+@media (min-width: 940px) {
+    .icon-content.menu-content {
+        width: 900px;
     }
 }
 
-@media (min-height: 568px) {
-    .menu-content .modal-body {
-        max-height: 430px;
+@media (min-height: 672px) {
+    .icon-content.menu-content {
+        height: 600px;
+        top: 0;
+        bottom: 0;
     }
-}
 
-@media (min-height: 667px) {
-    .menu-content .modal-body {
-        max-height: 530px;
-    }
-}
-
-@media (min-height: 736px) {
-    .menu-content .modal-body {
-        max-height: 600px;
-    }
-}
-
-@media (min-height: 768px) {
-    .menu-content .modal-body {
-        max-height: 630px;
+    .modal .modal-dialog .menu-content .modal-body {
+        max-height: 486px;
     }
 }

Bootstrap.Admin/Scripts/Menus.js

@@ -193,7 +193,8 @@
             $nestMenu.find('ol.dd-list:first').append($.format('<li class="dd-item dd3-item" data-id="0" data-order="10" data-category="{1}"><div class="dd-handle dd3-handle"></div><div class="dd3-content"><label><span>{0}</span></label></div></li>', menuName, menuCate));
         }
         $nestMenu.find('li[data-id="' + did + '"] > div.dd3-content span').addClass('active');
-        $dialogMenu.show().adjustDialog();
+        $dialogMenu.show();
+        if ($(window).width() >= 768 || $(window).height() >= 672) $dialogMenu.adjustDialog();
     });
 
     // 选择父节点按钮
@@ -203,7 +204,8 @@
         $nestMenuInput.find('label:last').find('input').show();
         $nestMenu.find('li.dd-item').hide().remove('[data-id="0"]');
         $nestMenu.find('li[data-category="' + $category.val() + '"]').show();
-        $dialogMenu.show().adjustDialog();
+        $dialogMenu.show();
+        if ($(window).width() >= 768 || $(window).height() >= 672) $dialogMenu.adjustDialog();
     });
 
     $dialogMenu.find('div.modal-header, div.modal-footer').on('click', 'button', function () {
@@ -264,8 +266,11 @@
     });
 
     $(window).on('resize.bs.modal', function () {
-        if ($dialogMenu.is(':visible')) {
+        if ($dialogMenu.is(':visible') && ($(window).width() >= 768 || $(window).height() >= 672)) {
             $dialogMenu.adjustDialog();
         }
+        else {
+            $dialogMenu.css({ margin: "0" });
+        }
     });
 });

Bootstrap.Admin/Views/Shared/MenuTree.cshtml

@@ -1,5 +1,5 @@
 <div id="dialogSubMenu" class="modal-dialog">
-    <div class="modal-content menu-content">
+    <div class="modal-content icon-content menu-content">
         <div class="modal-header">
             <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
             <h4 class="modal-title" id="myMenuModalLabel">请选择菜单</h4>