javascript - 如何在页面调整大小时禁用 Bootstrap 弹出窗口

Question

我正在使用 bootstrap popover 作为 drop down 菜单。有什么方法可以通过 css media queries 或 jquery 在页面调整大小时禁用 popover 功能，并使菜单可见且垂直移动 View 。

这是我尝试过的:

<a href="#"  id="ble" class="ved" data-placement="bottom" data-toggle="popover" data-content='
<ul class="nav nav-pill">
<li><a href="#" >home</a></li>
 <li><a href="#" >home</a></li>
 </ul>
 '>Toggle popover</a>
</div>
 <script>
 $(document).ready(function(){
$('#ble').popover({html:true}); 
$(window).on('resize', function () {
if ($window.width() > 300) {
   $('#ble').unbind('popover');
 }
  });
     });     

Answer 1

如果您使用 CSS 中的媒体查询会更容易。

@media (max-width: 300px) {
   #ble {display: none;}
}