我正在使用下面的代码在滚动条上添加类到导航栏。 它工作正常,但我希望它在单击导航栏中的和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);
    });

  ask by minute acc translate from so

本文未有回复,本站智能推荐:

1回复

如果悬停:动画完成后重新调用功能

我有一堆可滚动的内容。 当您将鼠标悬停在左按钮或右按钮上时,书架将像这样滑动。 所有这一切都完美。 当您单击向左或向右按​​钮时,架子将跳出架子的宽度。 也完美地工作。 我想做的是让架子在跳转后继续滚动,直到现在为止全部停止,直到您重新悬停鼠标为止。 我想这只是在跳转完成后重新调
1回复

用jquery动画替换核心javascriptscrollto

是否可以用自定义函数替换核心Javascript函数? 例如,我使用的是jQuery Mobile,每当页面转换时,它都会在页面顶部进行烦人的“跳转”。 我发现这是因为在'transitionPages'函数中它具有这一行 我想保留核心jQm代码(出于维护目的),因此尽管我认为这本来应
5回复

带有jQuery动画的慢/无响应动画

我正在编写一个小的jQuery函数,但似乎遇到了麻烦。 我要在这里做的是,当用户向下滚动页面90像素时,div标签应该向下动画(从top:-50px到top:0),反之亦然,当他们滚动回到页面顶部时。 我遇到的问题是动画有时看起来非常缓慢且无响应。 我在3种不同的浏览器和不同的计算机上
1回复

jQuery动画卡在循环中

我在我的网站上有一些简单的功能,可以为这个小精灵设置动画/使它看起来像是在滚动后向上或向下传送。 在文档准备好之后,动画工作得非常好,但是在滚动之后它会以某种方式陷入某种微妙的循环中。 我需要解决这个问题,以便它只是在页面加载时出现。 我不明白为什么会这样的故障。 这是小提琴 ,这里是j
1回复

jQuery:为什么此功能会触发4次?

我写了很多jQuery的东西来帮助我的朋友了解他的在线投资组合,可以在这里找到: http : //bradleyrogerson.com/ (作为我将要描述的内容的参考)。 这也是指向javascript的直接链接: http : //bradleyrogerson.com/static/
2回复

jQuery滚动功能的替代选择?

我有一个jQuery脚本,如下所示: 如您所见,当页面向下滚动100px时,我有了这个div'#algemeen'来更改其位置。 问题是,它非常笨拙,当我向上滚动时,它通常保持在“向下滚动”位置。 有没有更好的方法可以实现我的目标? 提前致谢!
1回复

变量在JQuery滚动功能内不起作用

我的目标是创建并显示将记录滚动位置的变量。 虽然滚动功能似乎正在工作(例如,我可以在其中警告消息),但是当我添加scroll_pos变量时,它只是停止工作。 我已按照本教程https://www.youtube.com/watch?v=AwgODLLSgwU进行操作,但我不明白我的代码有什么
1回复

如何在jQuery中使用滚动功能一次调用函数?

我有.viewPort区域,其中包含带有滚动的大元素。 并创建函数,如流代码: jQuery的: 当我滚动时,我在console.log中done了很多done ,浏览器崩溃了!!! 我知道这是因为滚动事件将太多的partLoader()发送到服务器! 所以...如何滚动一次