Question

当我滚动浏览某个部分时，我想将“sidebarActive”类添加到“sidebarButton”。每个'sidebarButton'都有'href'，它对应于一个带id的部分。我已经设置了一个有效的示例 - 当我滚动到id为#four的部分时，带有该href的'.sidebarButton'会添加类'sidebarActive'。如何扩展此概念以同时定位所有'sidebarButton'元素及其href。？

$(function(){
    $(window).scroll(function() {
        var scroll = $(window).scrollTop();
        var os = $('#four').offset().top;
        var ht = $('#four').height();
        if(scroll > os - ht){
           $('.sidebarButton[href="#four"]').addClass('sidebarActive');
    }
  });
});

Answer 1

您可以仅定位符合条件的所有.sideBarButton和.filter()

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

        //Target all element and remove class
        $('.sidebarButton[href]').removeClass('sidebarActive')
            //Use the filter to get the matching elements
            .filter(function () {
                var os = $(this.href).offset().top;
                var ht = $(this.href).height();
                return (scroll > (os - ht));
            }).addClass('sidebarActive');
    });
});

将类添加到href元素

1 个答案: