javascript - jQuery: 何かがアニメーションを遅らせています

Question

アニメーションの遅延の原因は何ですか? サイト上のすべての jQuery で何らかの遅延が発生しています。

$(function(){
  $(window).scroll(function() {
       var elementTop = $('body').offset().top; 
       var position = elementTop+ $(window).scrollTop();
       if(position >= 20){
           $('#top').animate({top: '40px'}, 300);
       } else if(position < 20){
           $('#top').animate({top: '80px'}, 300);
       }
console.log(position);
  });   
});

ライブ: ここにリンク- メニュー/ナビゲーションです

Answer 1

スクロールするたびにコードが実行されます。animateメソッドは連結され、次々に実行されます。目的を達成するには、現在のアニメーションを停止して、新しいアニメーションを開始する必要があります。

$(function(){
    $(window).scroll(function(){
        var elementTop = $('body').offset().top,
        position = elementTop+ $(window).scrollTop();

        if (position >= 20){
            $('#top').stop().animate({top: '40px'}, 300);
        }
        else if (position < 20) {
           $('#top').stop().animate({top: '80px'}, 300);
        }
    });   
});