使用lodash updatePosition不起作用

Question

你好所以我第一次使用lodash。我的jquery代码不断跳跃，我试图将它迁移到lodash函数中，但我不太明白。

IDK如果这件事情，但代码背后的主要想法是一个div向下滚动到一个位置并捕捉到的位置，但它继续跳跃。请指教 ！！

$(window).on('scroll', _.throttle(updatePosition, 100)); 

$(window).on('scroll', function(){ 
    var scroll = $(window).scrollTop(); 

    var sectionPosTop = document.getElementById('header-bamboo-scroll').getBoundingClientRect(); 

    var headerHeight = document.getElementById('header').getBoundingClientRect(); 


    if (scroll >= 660 && scroll <= 680) { 
     console.log('greater than 660 and less than 680'); 
     $('html, body').animate({ 
      scrollTop: headerHeight.height 
     }, 500, function() { 
      $('html, body').stop(); 
     }); 
    } 

}); 
}); 

Answer 1

我不明白，正是你想做的事，但你可以使用_.throttle获取代码执行之间的延迟，并且可以给你一个平滑的动画。您可以调整延迟时间（以毫秒为单位）以获得您想要的。

var updatePosition = function() { 
     var scroll = $(window).scrollTop(); 

     var sectionPosTop = document.getElementById('header-bamboo-scroll').getBoundingClientRect(); 

     var headerHeight = document.getElementById('header').getBoundingClientRect(); 


     if (scroll >= 660 && scroll <= 680) { 
     console.log('greater than 660 and less than 680'); 
     $('html, body').animate({ 
      scrollTop: headerHeight.height 
     }, 500, function() { 
      $('html, body').stop(); 
     }); 
     } 
    } 

    $(window).on('scroll', _.throttle(updatePosition, 100));