画像のギャラリーにサムネイルリストみたいなのがほしいねってなった.
常にユーザーに見えるように自動でスクロールを動かしたいな, ってなった時実装が面倒くさい.移動量を計算してscrollToを使うイメージがあった.
ところがググると今は専用のAPIが生えている.
Element: scrollIntoView() メソッド - Web API | MDN
ユーザーに見えるようにいい感じに移動してくれる.これはありがたい.
ところでこのAPIは常にスクロールしようとしてくる.
見えているなら別に移動しなくていいのに.と思っていたらexperimentalでまたAPIが生えている.
Element: scrollIntoViewIfNeeded() method - Web APIs | MDN
こいつを使いたいのでPonyfillを探してきた.
https://scroll-into-view.dev/scroll-into-view.dev
しかも大変ありがたいことに, このPonyfillにはboundaryが設定できる.
https://scroll-into-view.dev/#limit-propagation
これで指定要素内だけで自動スクロールもさせられるようになった.