jQuery 当事件发生时做点什么

Question

我正在尝试将 2 classes 添加到 div，第一个需要在当 scrolltop 等于一定数量时添加，如果 scrolltop 大于 a，则添加第二个一定数量。

这是我的 jQuery 代码：

var Scroll = $(window).scrollTop();
var ScrollFXfullHeight = $('.header-wrapper').height(); 

    if (Scroll == ScrollFXfullHeight) {
        $("#navigation, .hidden_menu_link_container").addClass("fixed");
    } else if (Scroll > ScrollFXfullHeight) {
        $("#navigation, .hidden_menu_link_container, .stop_the_jump").addClass("thinner");  
    }

上面的解决方案显然使用了 2 个 if 语句，这里的问题是页面必须完全等于 ScrollFXfullHeight 才能添加第一个 class，但是，如果您只是快速滚动过去，那么事件是未触发。

有没有一种方法可以说 "WHEN Scroll == ScrollFXFullHeight add class" 即使滚动过去也能做到？

Answer 1

检查 Scroll 是否大于或等于 ScrollFXfullHeight，然后检查您的元素是否已经具有 class fixed。如果没有，请添加：

if (Scroll >= ScrollFXfullHeight) {
    if(!$("#navigation, .hidden_menu_link_container").hasClass('fixed')) { 
        $("#navigation, .hidden_menu_link_container").addClass("fixed");   
    } 
    $("#navigation, .hidden_menu_link_container, .stop_the_jump").addClass("thinner");
}

这样，即使用户滚动到那个确切的点，仍然会添加 class，但只会添加一次。我觉得您可能还应该检查 thinner class 是否也已添加，但这是您的决定

jQuery 当事件发生时做点什么

jQuery do something WHEN an event happens

jquery

if-statement

addclass

.when