javascript - 当响应式导航崩溃开始时引发 JavaScript 事件

Question

当响应式设计的“导航折叠”功能启动时，如何调用 JavaScript 函数？

具体来说，我正在查看这个Bootstrap 示例。调整浏览器窗口的大小将打开/关闭它。我确定它在 Bootstrap 的 JS 中检查浏览器大小的某个地方。

有没有一种简单的方法可以做类似的事情，$(window).resize(x);并在该函数中检查崩溃是否发生？

Answer 1

看起来使用了 css 媒体查询。

例如：@media (min-width: 768px) and (max-width: 979px) { /* do stuff */ }

监听 javascript 中的窗口调整大小事件，如果你想在 JS 中做某事，可以在相同的情况下做任何你想做的事情：

$(window).on('resize', function(){

    var currentWidth = $(this).width();

    if(currentWidth > 768 && currentWidth < 979){
        //do stuff
    }
});

但是，正如@user1721135 提到的那样，您的示例仅使用 css，这就是这种情况下所需要的全部。

这会让你开始。