動畫滾動到帶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源代碼以了解它們是如何做到的。