Question

我需要在课程菜单列表中添加一个滚动条（见下图）。课程太多，因此可以翻页。顶部导航栏是固定的，因此滚动页面没有帮助。

当我添加css时：

.navbar .navbar-inner .usermenu .dropdown ul.dropdown-menu.courses {
   overflow-y: auto; /* or : scroll */
}

然后不显示课程模块的ul（即下面的示例图片中的方向模块）。我假设这是因为子子菜单嵌套在具有overflow-y：auto的ul中，因此不显示。如何解决将滚动条添加到课程子菜单但课程子菜单项未隐藏的问题。任何解决方案都很好，css，jquery等。

HTML和css相当过分，因为它是用moodle构建的，所以有很多事情要发生。基本的HTML结构如下：

<ul class='nav'>
   <li class='dropdown'>
       <ul class='dropdown-menu'>
          <li class='dropdown-submenu courses'>
              <ul class='dropdown-menu'>
                 <li class='dropdown-submenu courses'>
                     <ul class='dropdown-menu'>
                         <li class='dropdown-submenu course-submenu'>
                         </li>
                         .
                         .
                         .
                     </ul>
                 </li>
                 .
                 .
                 .
              </ul>
          </li>
       </ul>
   </ul>
</ul>

编辑：正如我所说，有很多css有助于此，但我会发布一个片段：

.navbar .navbar-inner .usermenu .dropdown ul.dropdown-menu {
  border: none;
  background: #2d2e2e;
  padding: 0px;
  border-radius: 0px;
  max-height: none !important;
}

.navbar .navbar-inner .usermenu .dropdown ul.dropdown-menu.courses{
  overflow-y: auto !important;
}

Answer 1

您应该为@available(iOS 9.0, *) override func previewActionItems() -> [UIPreviewActionItem] { let showAction = UIPreviewAction(title: "Show", style: .Default) { [weak self] (action: UIPreviewAction, vc: UIViewController) -> Void in guard let weakSelf = self else { return; } if let _popAction = weakSelf.popAction { _popAction() } self?.showViewController(vc, sender: nil) print("show city controller") } return [showAction] }提供X像素的最大高度并应用ul。

Answer 2

这将是糟糕的用户界面，用户体验也不会好。但是在那个注释上你可以在整个子导航中添加一个容器，给它的最大高度小于你希望浏览器显示的高度并溢出滚动它。这样整个导航将在此元素中打开并显示滚动条 - 因为您已经将鼠标指针放在那里，您可以只旋转鼠标以显示更下方的项目。正如我所说，你应该考虑一个更清洁的解决方案，如大型菜单风格等。

Answer 3

我用它来解决我的问题，它是一个jquery解决方案。 https://css-tricks.com/long-dropdowns-solution/

这不是我想要的，但实际上比滚动条更优雅，我没有嵌套的菜单问题。

将滚动条添加到包含子菜单项的菜单项，不隐藏子菜单项

3 个答案: