动画滚动到带ID的div

Question

我知道之前可能已经提出这个问题，但我找不到合适的答案。

我想要一个链接，当你点击它时，将页面滚动到一个带有ID的元素，只需要javascript，我就可以控制速度。

我知道：

document.getElementById('youridhere').scrollIntoView();

这不起作用。它只是突然进入视野。我也尝试了scrollBy，但由于它以增量方式工作，因此无效。我可以把它写起来检查元素的剩余距离，如果它小于增量，那么只移动剩下的东西，但这看起来太笨重了。

我也试过scrollTo，但这也没有多大帮助。

有更清洁的方法吗？

这只需要javascript。这是一个等价的jquery：

var top = target.offset().top;

$('html,body').animate({scrollTop: top}, 1000);

Answer 1

没有内置的方式来平滑滚动。我会在每次迭代时使用setInterval和scrollBy增量，然后在完成后使用clearInterval。

您还可以查看jQuery源代码，看看他们是如何做到的。