PR
TIPS

Swiperのインスタンスの取得方法と使い方

Swiperは非常に人気のあるスライダーライブラリで、多機能ながらシンプルなAPIを提供しています。特定のSwiperのインスタンスにアクセスするには、以下の方法で取得できます:

var mySwiper = document.querySelector('.swiper').swiper;

この方法で取得したSwiperのインスタンスには、Swiperの各種メソッドが利用可能です。例えば、次のスライドに移動する場合:

mySwiper.slideNext();

また、jQueryのeach関数などの中でSwiperのインスタンスを参照する場合、$(this).swiperの代わりにthis.swiperを使用する点に注意が必要です。

これは、SwiperのインスタンスはDOM要素自体に関連付けられているため、jQueryオブジェクトではなく純粋なJavaScriptのオブジェクトとしてアクセスする必要があるためです。

この記事を書いた人
Naokazu Yokoo

エンジニア歴20年以上。現在はWeb / AI領域で活動中。
開発環境・サーバー環境ともに速度と効率性を追求しています。

Follow Naokazu Yokoo
Follow Naokazu Yokoo

Comment

タイトルとURLをコピーしました