添加删除基于垂直滚动的jQuery类？

添加/删除基于垂直滚动的jQuery类？

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

     //>=, not <=    if (scroll >= 500) {        //clearHeader, not clearheader - caps H        $(".clearHeader").addClass("darkHeader");    }}); //missing );

另外，通过删除

clearHeader

该类，可以

position:fixed;

从元素中删除，并可以通过

$(".clearHeader")

选择器重新选择它。我建议不要删除该类，并在其顶部添加一个新的CSS类以用于样式设置。

如果要在用户向上滚动时“重置”类添加，请执行以下 *** 作：

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

编辑： 这是标题选择器的版本缓存-更好的性能，因为它不会在每次滚动时查询DOM，并且可以安全地删除/添加任何类到标题元素而不会丢失引用：

$(function() {    //caches a jQuery object containing the header element    var header = $(".clearHeader");    $(window).scroll(function() {        var scroll = $(window).scrollTop();        if (scroll >= 500) { header.removeClass('clearHeader').addClass("darkHeader");        } else { header.removeClass("darkHeader").addClass('clearHeader');        }    });});