[英]How to change Bootstrap popover position dynamically?
有什么方法可以根據窗口寬度更改Bootstraps Popover的位置嗎? 我正在使用它來顯示一些額外的表單項,並且需要顯示是否在左側站點上,但需要在頂部移動設備上顯示。 因此,基本上,當屏幕變小時-我需要更改位置。
jQuery('#monthly-expenses').popover({
content: jQuery('#monthly-expense-datails'),
placement() {
let placement = 'left';
if (jQuery(window).width() <= 992) {
placement = 'top';
}
return placement;
},
html: true,
trigger: 'manual'
})
更改窗口大小時,可以銷毀並重新創建彈出窗口:
var placement;
jQuery(window).on('resize',function(){
if (jQuery(window).width() <= 992 && placement == 'left') {//when the width is right and we did't change placement
placement = 'top';
jQuery('#monthly-expenses').popover('dispose');//destroy the
createPopover(placement);//create it with the new placement
} else if (jQuery(window).width() > 992 && placement == 'top')
placement = 'left';
jQuery('#monthly-expenses').popover('dispose');//destroy the popover
createPopover(placement);//create it with the new placement
}
});
function createPopover(placement) {
jQuery('#monthly-expenses').popover({
content: jQuery('#monthly-expense-datails'),
placement:placement,
html: true,
trigger: 'manual'
});
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.