特定のセクションにスクロール

ナビゲーションバーの各領域をクリックすると、該当する下の領域にスクロールします.
たとえば、「スキル」をクリックした場合は、次のスノーボード領域にスクロールする必要があります.

指定された長さでスクロールせずに、正確に領域にスクロールする方法はありませんか?

🔮 element.scrollIntoView

対応するelementにスクロールできるようです.

const $menuContact = document.querySelector(".menu--contact");
const $contact = document.querySelector(".contact");

$menuContact.addEventListener("click",scrollToContact);
function scrollToContact(){
  $contact.scrollIntoView()
}

ナビゲーションバーの[接触](Contact)をクリックすると、下部の接触領域まで下がります.

直接接触領域に移動して、切れたような気がします.
優しく転がってもいいですか?

🧿behavior

scrollIntoViewのパラメータ動作はアニメーションを定義します.
デフォルトではautoに設定され、スムーズに変わります.

🔮 結果

Reference

https://developer.mozilla.org/ko/docs/Web/API/Element/scrollIntoView