Question

您好我使用此jquery函数在垂直滚动页面上添加一个类。但我想在所有页面上具有可变高度的元素的末尾删除此类。例如，在页面上这个元素高度是400px而在另一个页面上它是1000px和... 如何测量元素高度并删除该高度上的类？

$(window).scroll(function() {    
    var scroll = $(window).scrollTop();

    if (scroll >= 500) {
        $(".clearHeader").addClass("darkHeader");
    } else {
        $(".clearHeader").removeClass("darkHeader");
    }
});

Answer 1

尝试（未测试）：

$(window).scroll(function() {    
    if ($(window).scrollTop() + $(window).height() == $(document).height()) {
        $(".clearHeader").removeClass("darkHeader");
    } else {
        $(".clearHeader").addClass("darkHeader");
    }
});

如果用户已滚动到页面底部，则删除课程。

Answer 2

您需要计算阈值（偏移元素顶部位置+元素的高度=从页面顶部到元素底部的总高度）并检查它何时被超越当前的滚动位置。

应该这样做：

$(window).scroll(function() {    
    var scroll = $(window).scrollTop();
    var threshold = $('.clearHeader').offset().top + $('.clearHeader').height();

    if (scroll >= threshold) {
        $(".clearHeader").addClass("darkHeader");
    } else {
        $(".clearHeader").removeClass("darkHeader");
    }
});

使用基于元素高度滚动的jquery添加/删除类？

2 个答案: