相关疑难解决方法(0)

我们是否有活动的navbar-toggle时候,我们是更小的屏幕上出现？

例如,

$('#myDropdown').on('shown.bs.navbar-toggle', function () {
  // do something…
});

$('#myDropdown').on('hide.bs.navbar-toggle', function () {
  // do something…
});

HTML,

<div class="navbar-header">
  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
    <span class="sr-only">Toggle navigation</span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
  </button>
  <!--<a class="navbar-brand" href="#">Home</a>-->
</div>

否则,我们如何检测navbar-toggle小屏幕上是否存在？

我正在尝试使用 Bootstrap 3 制作响应式网站。我使用他们的仪表板示例作为起点。

该示例在 768px 处有一个断点，以便顶部导航栏从“汉堡包”菜单按钮变为导航项的水平列表。当到达断点时我需要以某种方式做出反应。

基于this和this，我尝试绑定到按钮元素上的 show/hide.bs.collapse 事件，但无济于事。有没有办法绑定到事件或以某种方式侦听何时到达断点？

我已经设置了一个带有相关部分的JSFiddle（移动垂直滑块以更改导航栏）。这是我尝试过的 JavaScript：

$( ".navbar-toggle" ).on( "show.bs.collapse", function() {
    alert( "hamburger show" );
} )
.on( "hide.bs.collapse", function() {
    alert( "hamburger hide" );
} );