Question

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

EDIT 也许我在这里不清楚。当用户单击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);
    });

jQuery - 动画运行时禁用功能

0 个答案: