0

我正在使用下面的代码将滚动类添加到粘性导航栏。它工作正常，但我希望它在单击导航栏中的 li 元素时禁用滚动功能，因此当用户单击导航后的滚动动画开始时它不会开始更改类，所以我想我需要禁用滚动功能，直到滚动动画完成。有什么建议么？

编辑也许我在这里不清楚。当用户单击 li 项目时，我使用滚动动画。我还使用了一个函数，如果用户滚动到 li 项目所在的 div，它将添加活动类。当用户现在位于页面顶部并单击其中一个 li 项目时，活动类将首先添加到他们单击的 li 中，然后添加到所有 li 项目中，但我希望它只保留在 li他们点击的项目，所以也许我需要禁用在滚动功能上添加活动类，直到点击的滚动动画完成？

$(window).scroll(function(){
    var top = $(window).scrollTop(),
    nav_distance = 450,
    grid_3_distance = $("section.grid.third").offset().top - 1,
    grid_4_distance = $("section.grid.fourth").offset().top - 230;

    if(top > nav_distance) {
        $("section.grid.second ul").addClass("fixed");
    } else if(top < nav_distance) {
        $("section.grid.second ul").removeClass("fixed");
    }

    if(top > nav_distance){
        $("section.grid.second ul nav li").removeClass("active");
        $("section.grid.second ul nav li[data-intern='.grid.second']").addClass("active");
    }

    if(top > grid_3_distance){
        $("section.grid.second ul nav li").removeClass("active");
        $("section.grid.second ul nav li[data-intern='.grid.third']").addClass("active");
    }

    if(top > grid_4_distance){
        $("section.grid.second ul nav li").removeClass("active");
        $("section.grid.second ul nav li[data-intern='.grid.fourth']").addClass("active");
    }
});

$(function(){
    $("section.grid.second ul nav li").click(function(){
        $("section.grid.second ul nav li").removeClass("active");
        $(this).addClass("active");
        var id = $(this).attr("data-intern");
        $('html,body').animate({scrollTop:$(id).offset().top}, 500);
    });
4

0 回答 0