Question

我正在创建一个带有滚动插件的页面网站。我想根据滚动的距离为菜单项添加活动类。

导航：关于我们|服务|价格|联系人

如果我从顶部滚动0到800像素，那么关于我们将处于活动状态，如果我从顶部滚动800到1600像素，则服务将处于活动状态

依旧......

感谢名单

Answer 1

我解决了我的问题。

$(window).scroll(function() {    
$(".top_menu a.active").removeClass("active");
var scroll = $(window).scrollTop();
if (scroll <= 800) {
    $(".top_menu .item1").addClass("active");
}
else if (scroll <= 1600) {
    $(".top_menu .item2").addClass("active");
}
else if (scroll <= 2400) {
    $(".top_menu .item3").addClass("active");
}
else if (scroll <= 3200) {
    $(".top_menu .item4").addClass("active");
}
else if (scroll <= 4000) {
    $(".top_menu .item5").addClass("active");
}
else if (scroll <= 4800) {
    $(".top_menu .item6").addClass("active");
}

}）;

Answer 2

我找到了最好的解决方案，我使用的是scrollspy插件，它包含在bootstarp和uikit中，您可以从以下网址下载带有许多其他有用功能的uikit：http://www.getuikit.com/

Jquery根据滚动添加活动类

2 个答案: