twitter-bootstrap 当前菜单中的 Bootstrap 3 子菜单

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19774728/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 19:05:27  来源:igfitidea点击:

Bootstrap 3 Submenu within current menu

csstwitter-bootstrapdrop-down-menutwitter-bootstrap-3

提问by Ty Bailey

I am in need of a dropdown-submenu using Bootstrap 3.

我需要一个使用 Bootstrap 3 的下拉子菜单。

There are questions like this all over the place, one in particular that got me closer is this one: Bootstrap 3 dropdown sub menu missing

到处都有这样的问题,特别是让我更接近的是这个问题:Bootstrap 3 dropdown sub menu missing

However, the answers there display the dropdown to the right of the current menu. I need to display the dropdown within the current menu, just sliding the rest of the nav down when open.

但是,那里的答案会显示当前菜单右侧的下拉列表。我需要在当前菜单中显示下拉菜单,打开时只需向下滑动导航的其余部分。

Here is a bootply with what I have so far: http://bootply.com/91787

这是我到目前为止所拥有的引导:http://bootply.com/91787

Currently the submenu is just overlaying the current dropdown... I need the submenu to push the rest of the dropdown elements down when open. How can I achieve this? Any help getting the dropdown to activate on click instead of hover would be helpful as well, but the main question is more important.

目前子菜单只是覆盖当前的下拉菜单...我需要子菜单在打开时将其余的下拉元素向下推。我怎样才能做到这一点?任何让下拉菜单在点击时激活而不是悬停的帮助也会有所帮助,但主要问题更为重要。

回答by user2693017

Like this ? I′m not sure if I understood your question right.

像这样 ?我不确定我是否理解你的问题。

http://bootply.com/91794

http://bootply.com/91794



Edit:

编辑:

Quite simple, I hope this is what you want:

很简单,我希望这是你想要的:

.dropdown-menu {position: relative;}

http://bootply.com/91800

http://bootply.com/91800

回答by Mason

Jeff Mould solved this beautifully.

Jeff Mold 很好地解决了这个问题。

Git: https://github.com/jeffmould/multi-level-bootstrap-menu

Git:https: //github.com/jeffmould/multi-level-bootstrap-menu

Nav Demo: http://theboot.fenwickmedia.com/

导航演示:http: //theboot.fenwickmedia.com/