ページ内のアンカーリンクにスルスルと移動する「スムーススクロール」。パっと画面が切り替わらないだけでも、ちょっとそれっぽく見えたりしますよね。
実はjQueryやJSを使わなくても、CSSで簡単に実装することができます。
解決方法は？
html { scroll-behavior: smooth;}これだけ。
ただし、ページ内の全てのリンクがスムーススクロールの対象になるので、部分的にスムーズスクロールを制御したい場合や、動きに細かい指定をしたい場合はJSでの実装が必要でしょう。
まずはCSSで実装してみて、使用感に違和感や不具合があればJSに変更…でもいいかもしれません。
細かい調整ができないことはデメリットですが、簡単・シンプルに実装したい場合にはオススメの方法です。