動態更改彈出窗口位置，同時調整瀏覽器窗口大小

Question

我正在使用Twitter Bootstrap彈出窗口，我不知道如何在調整瀏覽器窗口大小時更改彈出窗口位置。問題是，當我調整窗口大小時，popover保持固定位置。我想像其他html元素一樣延遲彈出窗口。

代碼：

$('#popover1').popover({ 
    html : true, 
    content: function() { 
     return $("#form").html(); 
    }, 
    placement: "top" 
}); 

Answer 1

看一看下面的問題和答案：

• Bootstrap Popover showing at wrong place upon zoom in/out or resizing Browser window
• jQuery position element based on window resize

您需要使用的事件處理程序的大小調整事件：

$(window).resize(function() { 
    // your positioning code here 
}); 

在此代碼中，您必須重新定位元素。

Answer 2

這適用於我。它要求所有可見popovers的show事件：

$(window).off("resize").on("resize", function() { 
    $(".popover").each(function() { 
     var popover = $(this); 
     if (popover.is(":visible")) { 
      var ctrl = $(popover.context); 
      ctrl.popover('show'); 
     } 
    }); 
});