Safariでもスムーススクロールしたい😭😭😭
任意の要素がユーザーに見えるところまで要素の親コンテナーをスクロールするElement.scrollIntoView()ですが、Safariではbehaviorなどのオプションパラメーターをサポートしておらず、behavior:"smooth"を指定したとしてもスムーススクロールができません。
そこで、polyfill[1]を使ってSafariでもelement.scrollIntoView({ behavior:"smooth" });を有効にする方法を紹介します。
まず、以下のファイルをダウンロードします。
github.com
📁smoothscroll-master→📁src→📄smoothscroll.js
smoothscroll.jsをサイトのディレクトリに配置し、
<script src="smoothscroll.js"></script>で読み込んであげると、普通に
element.scrollIntoView({ behavior:"smooth" });するだけでSafariでも同じ挙動をするようになります。
[1]:最近の機能をサポートしていない古いブラウザーで、その機能を使えるようにするためのコード
Dustan Kastenさん、ありがとう😭😭😭
早くSafariが対応してくれるといいな・・・
