jQuery根据距离改变速度

Question

我想在滚动回浏览器窗口顶部时保持相对恒定的速度,具体取决于您离页面顶部的距离.

因此,如果您向下滚动页面500px或5000px,我想创建一个函数来计算动画回到顶部保持恒定速度所需的时间.

var scrollTo = function() {
   var top = $(window).scrollTop();
   var dist = $('.article').offset().top;
   var speed =  // not sure what goes here depending on distance

   $('html, body').animate( {scrollTop: dist}, speed, 'linear');
};

Answer 1

你可以使用类似的东西distance * <millisecond per unit distance>，

就像如果你想分别在 1000 毫秒和 3000 毫秒内覆盖 500 和 1500 的距离，那么公式将是

var speed = distance * 2

前任：

var speed = distance * 2

var scrollTo = function() {

  var dist = jQuery(window).scrollTop();
  var speed = dist * 2;

  $('html, body').animate({
    scrollTop: 0
  }, speed);
}

body {
  height: 5000px;
}