Javascriptのスライダーライブラリの中でも人気がある『swiper.js』はオプションがとても豊富です。当記事ではswiper.jsのオプションを使用してスライダーのアクセシビリティ(操作性)を向上させる方法につ […]
swiper
Swiperスライダーの矢印のサイズや位置や色を変更する
Swiper.jsで作成したスライダーのナビゲーション(矢印)のサイズや位置や色を変更したい時があると思います。当記事ではその方法をデモを交えながら解説します。 通常のSwiper.jsでのスライダーの作成はご存じの前提 […]
Swiperスライダーのページネーションのサイズや位置や色を変更する
Swiper.jsで作成したスライダーのページネーション(ドット)のサイズや位置や色を変更したい時があると思います。当記事ではその方法をデモを交えながら解説します。 通常のSwiper.jsでのスライダーの作成はご存じの […]
Swiperスライダーのデモ16選
Swiper.jsを使用して作成できるスライダーのデモを16選ご紹介します。また、それぞれのスライダーの作成方法を記した記事のリンクも載せておきます。 ①ノーマルなスライダー まずは特にカスタマイズしていないノーマルなス […]
【Swiper.js】フリップスライダーを作成する
swiper.jsを使用してフリップスライダーを作成する方法を記します。 通常のSwiper.jsでのスライダーの作成はご存じの前提で進めさせていただきますので、Swiper.jsを初めて使う方はこちらから先に参考いただ […]
【Swiper.js】カバーフロースライダーを作成する
swiper.jsを使用して当記事アイキャッチのようなカバーフロースライダーを作成する方法を記します。 通常のSwiper.jsでのスライダーの作成はご存じの前提で進めさせていただきますので、Swiper.jsを初めて使 […]
【Swiper.js】カードスライダーを作成する
当記事ではswiper.jsを使用してカードスライダーを作成する方法を記します。swiper.jsのオプションに用意されており、slick.jsにはおそらくない機能のひとつだと思います。 通常のSwiper.jsでのスラ […]
【Swiper.js】キューブスライダーを作成する
当記事ではswiper.jsを使用して立体的なキューブスライダーを作成する方法を記します。swiper.jsのオプションに用意されており、slick.jsにはおそらくない機能のひとつだと思います。 通常のSwiper.j […]
【Swiper】lazyオプションを使用して遅延読み込みする
当記事ではswiper.jsのlazyオプションを使用してSwiperスライダーを遅延読み込みする方法について記します。 通常のSwiper.jsでのスライダーの作成はご存じの前提で進めさせていただきますので、Swipe […]
【Swiper】グリッドスライダーの作り方
当記事ではswiper.jsを使用して、グリッドスライダーを作成する方法を記します。 通常のSwiper.jsでのスライダーの作成はご存じの前提で進めさせていただきますので、Swiper.jsを初めて使う方はこちらから先 […]