javascript - Twitter Bootstrap Popovers - 如何让它们留下来？

Question

回复:http://getbootstrap.com/javascript/#popovers

我的弹出窗口由 hover 事件触发。当弹出窗口出现时，我在弹出窗口中放置了几个链接，我希望我的用户有机会点击这些链接。但是，当鼠标指针离开弹出框的热点并试图进入弹出框区域时，弹出框会消失。

有没有办法让弹出窗口保持不变？

Answer 1

您可以将弹出窗口的 container 元素设置为触发弹出窗口的元素。

Demo in fiddle

HTML:

<button type="button" class="btn btn-lg btn-danger popover-dismiss" 
        data-toggle="popover" title="Dismissible popover"
        data-content="And here's some amazing content. It's very engaging.">
    Dismissible popover
</button>

JavaScript:

$('.popover-dismiss').popover({
    trigger: 'hover',
    container: '.popover-dismiss'
})

CSS:

.popover-dismiss .popover {
    color: #333 ;
}

不幸的是，您需要添加 CSS，因为在示例中 button CSS 覆盖了 popover CSS。