さまざまな投稿を調べましたが、有効な解決策は見つかりませんでした。水平スクロールバーをスナップするための多くのソリューションがありますが、アイテムが同じサイズである場合にのみ機能します。
小さな例を挙げます：
画面は、幅が 300px を表示できます。スクロールバー内のアイテムは、次のようにさまざまなサイズにすることができます。
- 1: 300px
- 2: 300px
- 3: 500px
- 4: 400px
* が 100px の場合、レイアウト全体は次のようになります。
1 2 3 4
[***][***][*****][****]
これで、スクロールバーはアイテムの開始/終了に正確にスナップするはずです。最初の 2 つのアイテムは画面と同じサイズなので簡単です。しかし、残りの部分については、有効な解決策であるかどうかはわかりません。
したがって、3 番目の項目までスクロールすると、スクロールバーは画面の左側の項目 3 の先頭にスナップするはずです。( '!' = 画面サイズ)
1 2 3 4
[***][***]![***!**][****]
アイテム 4 までスクロールすると、スクロールバーは画面右側のアイテム 3 の最後に正確に収まるはずです。
1 2 3 4
[***][***][**!***]![****]
説明するのはとても難しいです。私の問題を理解していただければ幸いです。