是否可以根据屏幕宽度更改Bootstrap popovers的位置？

我有一个项目列表，每个项目都有一个与之关联的Bootstrap popover（ 此处为docs ）。 他们是这样发起的：

$('#my_list li').popover({ placement: 'left' }); 

这样可行，但在宽度较小时，弹出窗口会从视口中丢失。 我想根据$(document).width();条件设置$(document).width(); 但是我无法看到覆盖初始选项的方法（例如，在大约1000px的宽度，将位置切换到’上方’）。

我在这里为jsfiddle编写了一个简化版本。 非常感谢。

Answer 1

放置也可以将函数作为其值。 在此函数中，您可以根据视口的宽度返回适当的值。 例如。

 $(document).ready(function(){ $('#my_list li').popover({ placement: wheretoplace }); }); function wheretoplace(){ var width = window.innerWidth; if (width<500) return 'bottom'; return 'left'; } 

Answer 2

它在窗口上从左到右的位置变化小于768

 placement: function(){return $(window).width()>768 ? "auto left":"auto top";}