如何在自动滚动到某个位置时更改滚动速度？

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);