スライダーライブラリのSplide (スプライド)で「1つのスライダーに複数のスライドを表示させる方法」

  • マンツーマン
    個別講義開催中!

    エラーの解消から、
    実装方法まで丁寧に教えます!
    講師が答えられるなら、
    基本的にどんな内容でも
    OK!

    詳細はこちら!
  • 質問し放題プラン!
  • スクール形式講義も

    プロを目指したい方
    講義を何回も受けたい方はこちら!
    個別のカリキュラムを作成し、
    長期的にサポート!

    詳細はこちら!
  • discordコミュニティ
この動画では、軽量で高機能なスライダーライブラリ「Splide (スプライド)」の基本的な使い方から、さらに応用的な設定方法までを解説しています。前回の動画では、Splide の基本的な読み込み方法や HTML 構造について説明しましたが、今回は 「1ページに複数のスライドを表示させる方法」 を中心に解説しています。

具体的には以下のオプションについて説明しています。
・perPage:一度に表示するスライド数を指定できます。例えば、perPage: 3 にすると3つのスライドが同時に表示されます。
・perMove: スライドを1回の操作で何個ずつ動かすかを指定できます。例えば perMove: 1 にすると、1つずつスライドが動くようになります。
・type(slide, loop, fade)
・rewind

動画を見ながら実際にコードを書いて試すことで、Splide の動作を理解しやすくなります。次回の動画ではさらに細かい設定やアニメーションのカスタマイズについて解説する予定ですので、興味がある方はチェックしてください。


この動画はシリーズになっていて、下記動画リストで他のSplideの動画を視聴することができます。
https://factory-programming-mv.com/playlistDetails/PLv7E5OqNAIPyRciXnWSBjVE4_zEvN4LdQ/