スライド(スワイプ)で簡単に要素を切り替えることが出来るCSS「スクロールスナップ」についてご紹介します。 JavaScript(jQuery)で今までやらざるを得なかったスライド動作をCSSのみで軽快に行うことが出来ます。 現在は対応ブラウザも増えているため、用途が合えば採用してみましょう。 スクロールスナップとは? スクロールスナップとは、ユーザーがスライド動作、スマホではスワイプ動作を行った時に、要素を特定の位置で静止させるスクロールが実現できます。 実際に見たほうが分かりやすいので、下記のGIFアニメーションをご確認ください。 このページで公開しているサンプルをスマホで操作した時の動きです。 こんな風に、要素毎にスクロールをスナップすることが出来ます。 1枚めくるような動作になるため、漫画やプレゼン資料を公開したい時などに向いています。 スクロールスナップ用プロパティの対応状況 ス