动画滚动到带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源代码以了解它们是如何做到的。