滚动后触发JQuery动画的scrollTop

Question

我编写了一个动画功能，当我通过单击按钮触发它时可以很好地工作，但是当我在滚动div时尝试触发它时，动画在动画上会跳动（跳到div顶部）。

编辑：一个jsfiddle示例https://jsfiddle.net/mxubjhko/5/

这是eventListener代码：

var lastPosition = 0;
var doneAnimate = true;
var lastID = 1;
window.onload = function() {
  document.getElementById("content").addEventListener("scroll", function(e) {
    e.preventDefault();
    var current = document.getElementById("content").scrollTop;
    if (lastTopPosition > current) {
      if (doneAnimate) {
        Slide(lastID - 1);
      }
    } else if (lastTopPosition < current) {
      if (doneAnimate) {
        Slide(lastID + 1);
      }
    }
    lastTopPosition = current;
    return false;
  })
}

这是动画功能：

function Slide(ID) {
  console.log(ID)
  lastID = ID;
  $("#content").animate({
      scrollTop: $("#part" + ID).offset().top
    }, {
      duration: 1000,
      easing: "linear",
      complete: function() {
        doneAnimate = true;
      },
      start: function() {
        doneAnimate = false;
      }
    }


  );
}