Swiperを使用した、スライドアニメーションで切り替わるスライダーです。
アレンジしやすい基本のサンプルになっています。
フェードで切り替わるタイプのサンプルについてもまとめてあります。
目次
オート
See the Pen swiper-slider-auto by maonyan516 (@maonyan516) on CodePen.
▼ アクティブスライドが中央にくるタイプ
See the Pen Untitled by maonyan516 (@maonyan516) on CodePen.
ボタンで切り替え
確認しやすさのために、autoplayは設定していません
ナビゲーションボタンで切り替え
See the Pen swiper-slider-nav by maonyan516 (@maonyan516) on CodePen.
ページネーションで切り替え
See the Pen swiper-slider-auto02 by maonyan516 (@maonyan516) on CodePen.
マウスで切り替え
See the Pen swiper-slider-mouse by maonyan516 (@maonyan516) on CodePen.