$（window）.scroll（）给出不准确的结果:(

Question

我正在使用$（window）.on（＆＃39; scroll＆＃39;）有条件地设置一个绝对定位的元素＆＃39; top值基于来自滚动事件处理函数内的$（window）.scrollTop（）的返回值。

基本上，这将滚动带有页面的项目（如固定位置），直到达到停止点，此时元素应停止滚动。

然后我使用$（window）.scrollTop（）来查找页面垂直滚动的数量，然后使用从顶部整数量滚动（以px为单位）来偏移/递增目标元素top css属性。 / p>

然后我有一个数据属性来描述滚动效果将停止的位置。

首先看来这种方法按预期工作，但是在测试期间我看到用户向下滚动的速度会影响实际元素停止更新CSS的位置。为什么我的元素不会停在应该的位置..为什么如果我向下滚动然后再向上，元素不会返回其原始位置？

以下是codez：

 /**
 * Will add the amount scroll from top of doc to the top css 
 * prop on the targeted item and stop the item at a specified amount from top
 * as well as debounce the events as they are scrolled 
 */

;(function parallaxTest(){
var lastScrollPoint = 0, lastScrollEvent = 0, captureEventInt = 1;
var parallax = function(){
  // Throttle the events to only use every other 1 (%50 reduction)
  if (lastScrollEvent !== captureEventInt){
    console.log(lastScrollEvent+' debounced');
    // Auto incr the lastScrollEvent tracking until it matches the above index value 
    lastScrollEvent++;
    // Ignore every other event that comes from user scroll
    return;
  }
  else {
    var distToTopInt = $(window).scrollTop(), target = $('button'),
        speedFlt = parseFloat(target.attr('data-parallax-speed')),
        distToStopAtInt = parseFloat(target.data('parallax-stop-at'));
    /**
    * Gets the direction of the users scroll while scrolling
    * @param {Int} currentScroll the px amount that the user is scroll to from top of window
    * @param {Int} prevScroll the px amount of the $(window) when last functioning scroll event fired prior to this one
    * @return {String} down | up
    **/
    var getScrollDir = function(currentScroll, prevScroll){
      if  (currentScroll > prevScroll){ 
        return 'down'; 
      } 
      else { 
        return 'up';
      };
    };

    if (distToTopInt <= distToStopAtInt){

      if (getScrollDir(distToTopInt, lastScrollPoint) === 'down') {
        target.css('top', '+='+distToTopInt +'px');
      }

      else if (getScrollDir(distToTopInt, lastScrollPoint) === 'up') {
        target.css('top', '-='+distToTopInt+'px');
      }
    }
    lastScrollPoint = distToTopInt;
    console.log(lastScrollEvent+' used');
    lastScrollEvent = 0;
  }
}
$(window).on('scroll', parallax);
})();

以下是分解为实际问题的代码：

重新创建的步骤：

滚动慢，现在看到按钮停止增加的位置。 快速滚动，现在可以看到按钮停止增加的位置。

http://codepen.io/nicholasabrams/pen/WbdrJd

我已经在这里和其他地方进行了研究，但无法找到解决方案，为什么会发生这种情况！ HELLLPPP ...