Question

我的侧边栏看起来有点像这个网站的侧边栏：http://scotch.io/

如果将鼠标悬停在教程上，则会使用可供选择的项目菜单展开该元素。

我想要做的就是得到它，如果我点击其中一个元素，它会显示一个漂亮的弹出框，而不是扩展整个侧边栏。可以轻松实现的东西，但如果只是表现出来也很好。

我查看了bootstrap 3 popover，但它似乎只适用于按钮，而我正在使用的是我的一个列表元素：

<li class="sidebar-available-rooms" data-container="body">
    <a class="fa fa-comments" id="sidebar-icon-comments" data-toggle="popover" data-placement="right"></a>
    <span class="sidebar-text" id="sidebar-available-rooms-text">Available Rooms</span>
</li>

我可以点击它，并以最简单的形式，在元素的右侧获得一个弹出窗口。

由于

Answer 1

使用一小段jQuery，它也适用于链接。

$("[data-toggle=popover]").popover({html:true})

检查这个小提琴：http://jsfiddle.net/HsZ9q/5/

Bootstrap可扩展侧栏元素

1 个答案: