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); 
    }); 
}); 

直播： Link here - 這是菜單/導航

Answer 1

您的代碼被每次滾動時被解僱。方法被連接在一起，依次運行。要達到您想要的效果，您需要停止當前動畫並開始新動畫：

$(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); 
     } 
    }); 
});