自舉彈出窗口動態更改位置從上到下

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>

希望能幫助到你。