javascript - Bootstrap 可扩展侧边栏元素

标签 javascript html css twitter-bootstrap popover

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

如果您将鼠标悬停在教程上,它会展开带有可供选择的元素菜单的元素。

我想要做的是获取它,这样如果我单击其中一个元素,它就会显示一个漂亮的弹出框,而不是展开整个侧边栏。一些可以缓和的东西,但如果它只是出现也很好。

我查看了 bootstrap 3 弹出窗口,但它似乎只适用于按钮,我正在使用的是我的列表元素之一:

<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>

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

谢谢

最佳答案

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

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

检查这个 fiddle :http://jsfiddle.net/HsZ9q/5/

关于javascript - Bootstrap 可扩展侧边栏元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25085700/

相关文章:

java - 使用 HTML 中的 ITextRenderer 在每个页面上添加页眉或页脚

javascript - 这是如何取消订阅 react 中的事件吗?

javascript - 在具有 if/else 语句的 for 循环中延迟迭代

javascript - 中止之前的ajax请求但有延迟吗?

php - 关于 javascript History.go 的简单问题

html - Mac 上的 Chrome 浏览器 : Scrollbars disappear when using `position: sticky`

javascript - + javascript 中表达式前的运算符 : what does it do?

asp.net - 同一页面上的多个 MS 图表使用相同的图像映射

javascript - 使用触发器禁用右键单击上下文菜单以将其重新启用

css - IE 中的随机@font-face 问题。