滚动后添加类也需要在刷新时工作

Posted 2021-05-04

我有一个工作脚本，在滚动80px后向主体添加一个类。这有效，但我已经滚动然后刷新页面后也需要它。

也许可以按位置更换滚动部分？

// fixed header
$(function() {
    $(window).scroll(function() {
        var scroll = $(window).scrollTop();
        if (scroll >= 80) {
            $("body").addClass('fixed');
        } else {
            $("body").removeClass("fixed");
        }
    });
});

答案

你是对的。你需要检查事件和初始值：

window.addEventListener('load', function() {
    var scroll = $(window).scrollTop();
    if (scroll >= 80) {
        $("body").addClass('fixed');
    }
    //no removing needed cause refresh did it
});

另一答案

$(window).scroll只会在滚动事件发生时触发。如果要在页面加载时检查滚动位置，则应在$(window).scroll回调之外执行此操作，如下所示：

function updateScroll() {
    if ($(window).scrollTop() >= 80) {
        $("body").addClass('fixed');
    } else {
        $("body").removeClass("fixed");
    }
}

$(function() {
    $(window).scroll(updateScroll);
    updateScroll();
});