如何有一个带词缀的弹出窗口？

Question

对于 Bootstrap 有经验的用户来说，这应该是一个简单的问题 :)

我想在 div 元素上有一个弹出窗口并附加弹出窗口。

目标是：当用户向下滚动时，如果弹出窗口离开屏幕，它会得到一个 "position: fixed" 或类似的东西。

这是我能做的最好的了：

$('.start').click(function (event) {
    $(this).popover({
        placement: 'top',
        html: true,
        content: '<div id="popover-id">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas hendrerit auctor neque eu elementum.</div>',
        title: 'Popover',
        container: '.container'
    }).popover('show');
    $('#popover-id').parent().parent().affix({
        offset: {
            top: 175
        }
    });
});

参见fiddle：http://jsfiddle.net/fx53fvwf/1/

问题是

之间的一种冲突

插入 'top: xxx px'
向下滚动时插入 'position: fixed' 的词缀

Answer 1

为了解决冲突，你必须优先使用 !important 关键字，词缀顶部位置如下：

.affix {
    top: 15px !important;
}

查看更新 fiddle：http://jsfiddle.net/fx53fvwf/4/

尽情享受吧！ ^^

如何有一个带词缀的弹出窗口？

How to have a popover with affix?

popover

twitter-bootstrap

affix