取決於可用空間的Popover Placement。

Question

請看附圖。

正如你可以看到我顯示一個popover。基本上我想根據可用空間（左側或右側）更改彈出窗口的位置。現在它走出了一個形象。

及其看上盒（IFRAME）

顯示使用此代碼的酥料餅。

// Position and show the message. 
     this.message 
      .css({ 
       left: (tPosition.left + "px"), 
       top: ((tPosition.top + t.outerHeight()) + "px") 
      }) 
      .show(); 

Answer 1

我會做這樣的事情：

this.message 
    .css({ 
      left : function() { 
       if (tPosition.left + $(this).width() >= $(this).parent().width()) { 
        return $(this).parent().width() - $(this).width(); 
       } 
       else { 
        return tposition.left; 
       } 
      }, 
      top : function() { 
      if (tPosition.top + $(this).height() > $(this).parent().height()) { 
        return $(this).parent().height() - $(this).height(); 
       } 
       else { 
        return tposition.top; 
       } 
      } 
     }); 

基本上你需要檢查，如果彈出會告訴你它之前超越您的容納箱的界限，並適當調整。在水平軸上，這與確保鼠標位置x +彈出窗口的寬度不大於父容器的寬度一樣簡單。在縱軸上，您要確保鼠標位置y +彈出高度不大於父容器高度。