自举弹出窗口动态更改位置从上到下

Question

我在使用引导程序弹出窗口时遇到问题，当弹出窗口到达视口顶部时，我无法确定如何从顶部到底部更改弹出窗口的位置。 我尝试使用

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

$(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);
});

更新

这对我有用，对于顶部的“弹出式窗口”有效，但是底部的弹出式窗口位置为负数，并且始终显示在底部

Answer 1

您需要使用data-placement="auto top" ，如果可能的话，弹出窗口将跳至顶部，但如果不能，则跳至该元素的底部。

总而言之，您要声明所需的位置，如果无法做到，则相反-（与“自动左”相同，如果可能，则向左移动，否则，则向右移动）。

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

希望能帮助到你。