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

Question

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

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

有没有一种简单的方法可以让我执行类似 $(window).resize(x); 的操作，并在该函数中检查是否发生了崩溃？

Answer 1

看起来像css media queries被使用。

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

如果您想在 JS 中执行某些操作，则在 javascript 中监听窗口调整大小事件并在相同情况下执行您喜欢的任何操作:

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

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

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

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

This会让你开始。