如何在引導程序中控制彈出窗口箭頭位置4

Question

我想在引導程序中使用彈出窗口4.我在右上角設置切換按鈕。

第一，如果我設置的BUTTOM的酥料餅：

$(function() { 
$('[data-toggle="popover"]').popover({ 
placement: 'bottom' 
}) 

的酥料餅，將顯示帶有部分關閉屏幕，如：

然後我嘗試使用「自動」而不是「底部」的位置，但在這種情況下，彈出不起作用...

之後，我再次使用「底部」的位置，並使用offs等來酥料餅50像素向左移動並增加酥料餅的寬度：

$('[data-toggle="popover"]').popover({ 
placement: 'bottom', 
offset: '0 50px' 
}) 

CSS：

.popover-content{ 
width: 270px; 
}  

則酥料餅的顯示這樣的：

現在彈出式箭頭位置錯位，我嘗試用「'shown.bs.popover'事件移動箭頭位置，如：

$('[data-toggle="popover"]').on('shown.bs.popover', function() { 
$('.popover.bottom .popover-arrow:after').css('right', 50 + 'px'); 
}); 

，但它不工作....

是否有任何人知道如何移動箭頭現在的位置，或當顯示了隱藏的箭頭？

在此先感謝。

Answer 1

您可以調整箭頭的位置以下樣式：

引導3

.popover.bottom > .arrow { 
    margin-left: 50px; 
} 

引導4

.popover.bs-tether-element-attached-top::after, 
.popover.bs-tether-element-attached-top::before{ 
    left: 65%; 
}