Question

我有一个bootstrap popover的问题，我无法想象当它到达视口顶部时如何从上到下改变弹出窗口位置。我试着用

展示位置：'自动底部'，但这对我不起作用。

$(function(){
var options = {
    placement: function (context, element) {
        var position = $(element).position();
        console.log(position.top - $(window).scrollTop());
        if (position.top - $(window).scrollTop() < 110){
            return "bottom";
        }
        return "top";
    }, html: true
};
$(".popover-link").popover(options);
});

更新

这对我有用，因为“popover”在顶部，但是底部的popover得到负面位置，并且它总是显示在底部

Answer 1

你需要使用data-placement="auto top"，如果可能的话允许popover到顶部但如果没有 - 那么到元素的底部。

总结一下你说出你想要的位置，如果它不能做到，那就相反了 - （如果可能的话，自动左边会允许它向左移动，但如果不可以，则为右边）。

<a href="#" title="Sample Title" data-toggle="popover" data-placement="auto top" data-content="Sample Content">Click</a>

Answer 2

只需通过data-placement =“bottom”

来实现

 <a href="#" title="Header" data-toggle="popover" data-placement="bottom" data-content="Content">Click</a>

希望它有所帮助。

bootstrap popover动态从上到下改变位置

2 个答案: