如何使用Bootstrap获得一个不错的可折叠侧栏菜单

Question

我已经看到无数的侧栏导航菜单用bootstrap制作的例子，但没有一个看起来是我喜欢的方式。

我找了几个特点：

• 每个菜单项都有一个图标和文字
• 可折叠：只显示图标和顶级菜单项倒塌
• 倒塌时，简单的动画时/ uncollapsing（边栏过来的内容）
• 顶级菜单项和子菜单项（层次）

This one is nice but doesn't collapse

This one collapses (but not the way I want) but is missing icons + submenu items

This one (2nd example) has the collapsing behaviour I want but is missing some other things (and the way to make the menu appear is ugly)

是否有可能对与引导+ javascript中的侧边栏所有这些功能？

Answer 1

我试着转换一个侧栏上你需要什么。

请在这个Codepen

希望这有助于看看！