Bootstrap可擴展側欄元素

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/