自動滾動到某個位置時如何更改滾動速度？

Question

當用戶單擊此按鈕時，我將執行以下操作：

const myDiv = document.getElementsByClassName('someClass')[0];
myDiv.scrollTop = myDiv.scrollHeight;

但是它跳得太快了，用戶需要花費一些時間來重新定向頁面。 有什么方法可以更逐步地滾動到新位置（沒有jQuery）？

Answer 1

我不記得我是從哪里找到這個功能的，但是它起作用了:)

function scrollTo(element, to, duration) {
  if (duration <= 0) return;
  var difference = to - element.scrollTop;
  var perTick = difference / duration * 16;
  var turn = element.scrollTop < to;
  setTimeout(function () {
    element.scrollTop = element.scrollTop + perTick;
    if ((turn && element.scrollTop >= to) || (!turn && element.scrollTop <= to)) {
      element.scrollTop = to;
      return;
    }
    scrollTo(element, to, duration - 16);
  }, 16);
};

const myDiv = document.getElementsByClassName('someClass')[0];
scrollTo(myDiv ,myDiv.scrollHeight,400);