カルーセルを導入するためによく利用されている Swiper。
最近こやつをよく触るのですが、どのイベントを使えばいいのか毎回調べないといけなくて面倒。
というわけで、いつも助けていただいて頭が上がらない翻訳サービスの Deepl 先生に Swiper API の Event を全てぶん投げてみました。
activeIndexChange(swiper)
Event will fired on active index change
アクティブインデックスの変更時にイベントが発生
afterInit(swiper)
Event will fired right after initialization
初期化直後にイベントが発生
beforeDestroy(swiper)
Event will be fired right before Swiper destroyed
イベントはSwiperが破壊される直前に発生します。
beforeInit(swiper)
Event will fired right before initialization
初期化の直前にイベントが発生
beforeLoopFix(swiper)
Event will be fired right before “loop fix”
イベントは “ループフィックス “の直前に発生します。
beforeResize(swiper)
Event will fired before resize handler
リサイズハンドラの前にイベントが発生する
beforeSlideChangeStart(swiper)
Event will fired before slide change transition start
スライドチェンジが始まる前に発生するイベント
beforeTransitionStart(swiper, speed, internal)
Event will fired before transition start
トランジション開始前にイベントが発生
breakpoint(swiper, breakpointParams)
Event will be fired on breakpoint change
ブレークポイントの変更時にイベントが発生する
changeDirection(swiper)
Event will fired on direction change
方向転換時にイベントが発生する
click(swiper, event)
Event will be fired when user click/tap on Swiper. Receives touchend event as an arguments.
ユーザーがSwiperをクリック/タップするとイベントが発生します。引数としてtouchendイベントを受け取ります。
destroy(swiper)
Event will be fired on swiper destroy
スイパーが破壊されたときにイベントが発生する
doubleClick(swiper, event)
Event will be fired when user double click/tap on Swiper
イベントは、ユーザーがSwiperをダブルクリック/タップしたときに発生します。
doubleTap(swiper, event)
Event will be fired when user double tap on Swiper’s container. Receives touchend event as an arguments
ユーザーがSwiperのコンテナをダブルタップするとイベントが発生します。引数としてtouchendイベントを受け取る
fromEdge(swiper)
Event will be fired when Swiper goes from beginning or end position
イベントは、Swiperが開始位置または終了位置から移動したときに発生します。
imagesReady(swiper)
Event will be fired right after all inner images are loaded. updateOnImagesReady should be also enabled
イベントはすべてのインナーイメージが読み込まれた直後に発生します。 updateOnImagesReadyも有効にしてください。
init(swiper)
Fired right after Swiper initialization.
スワイパーの初期化後、すぐに発射されました。
loopFix(swiper)
Event will be fired after “loop fix”
イベントは “ループフィックス “後に発生します。
momentumBounce(swiper)
Event will be fired on momentum bounce
勢いよく跳ねた時にイベントが発生する
observerUpdate(swiper)
Event will be fired if observer is enabled and it detects DOM mutations
オブザーバーが有効になっていて、DOMの変異を検出するとイベントが発生します。
orientationchange(swiper)
Event will be fired on orientation change (e.g. landscape -> portrait)
向きが変わったときにイベントが発生する（例：横向き→縦向き
progress(swiper, progress)
Event will be fired when Swiper progress is changed, as an arguments it receives progress that is always from 0 to 1
イベントはSwiperの進捗状況が変更されたときに発生します。引数として、常に0から1の進捗状況を受け取ります。
reachBeginning(swiper)
Event will be fired when Swiper reach its beginning (initial position)
イベントはSwiperが最初（初期位置）に到達したときに発生します。
reachEnd(swiper)
Event will be fired when Swiper reach last slide
イベントは、Swiperが最後のスライドに到達したときに発生します。
realIndexChange(swiper)
Event will fired on real index change
リアルインデックスの変化でイベントが発生する
resize(swiper)
Event will be fired on window resize right before swiper’s onresize manipulation
イベントはウィンドウのリサイズ時に、スイーパーのonresize操作の直前に発生します。
setTransition(swiper, transition)
Event will be fired everytime when swiper starts animation. Receives current transition duration (in ms) as an arguments
イベントは、スイーパーがアニメーションを開始するたびに発生します。現在の遷移時間（ms）を引数として受け取ります。
setTranslate(swiper, translate)
Event will be fired when swiper’s wrapper change its position. Receives current translate value as an arguments
イベントは、スイーパーのラッパーの位置が変わったときに発生します。現在の翻訳値を引数として受け取ります。
slideChange(swiper)
Event will be fired when currently active slide is changed
現在のアクティブなスライドが変更されるとイベントが発生します。
slideChangeTransitionEnd(swiper)
Event will be fired after animation to other slide (next or previous).
イベントは、他のスライド（次または前）へのアニメーションの後に発生します。
slideChangeTransitionStart(swiper)
Event will be fired in the beginning of animation to other slide (next or previous).
イベントは、他のスライド（次または前）へのアニメーションの開始時に発生します。
slideNextTransitionEnd(swiper)
Same as “slideChangeTransitionEnd” but for “forward” direction only
slideChangeTransitionEnd “と同じですが、”forward “方向のみです。
slideNextTransitionStart(swiper)
Same as “slideChangeTransitionStart” but for “forward” direction only
slideChangeTransitionStart “と同じですが、”forward “方向のみです。
slidePrevTransitionEnd(swiper)
Same as “slideChangeTransitionEnd” but for “backward” direction only
slideChangeTransitionEnd “と同じですが、”backward “方向のみです。
slidePrevTransitionStart(swiper)
Same as “slideChangeTransitionStart” but for “backward” direction only
slideChangeTransitionStart “と同じですが、”backward “方向のみです。
slideResetTransitionEnd(swiper)
Event will be fired in the end of animation of resetting slide to current one
スライドを現在のものにリセットするアニメーションの最後にイベントが発生する
slideResetTransitionStart(swiper)
Event will be fired in the beginning of animation of resetting slide to current one
イベントは、スライドを現在のものにリセットするアニメーションの開始時に発生します。
sliderFirstMove(swiper, event)
Event will be fired with first touch/drag move
イベントは最初のタッチ/ドラッグの動きで実行されます。
sliderMove(swiper, event)
Event will be fired when user touch and move finger over Swiper and move it. Receives touchmove event as an arguments.
イベントは、ユーザーがSwiperにタッチして指を動かしたときに発生します。touchmoveイベントを引数として受け取ります。
slidesGridLengthChange(swiper)
Event will be fired when slides grid has changed
スライドグリッドが変更されたときに発生するイベント
slidesLengthChange(swiper)
Event will be fired when number of slides has changed
スライドの枚数が変更されるとイベントが発生する
snapGridLengthChange(swiper)
Event will be fired when snap grid has changed
スナップグリッドが変更されるとイベントが発生する
snapIndexChange(swiper)
Event will fired on snap index change
スナップインデックスの変更時に発生するイベント
tap(swiper, event)
Event will be fired when user click/tap on Swiper. Receives touchend event as an arguments.
ユーザーがSwiperをクリック/タップするとイベントが発生します。引数としてtouchendイベントを受け取ります。
toEdge(swiper)
Event will be fired when Swiper goes to beginning or end position
イベントはSwiperが開始位置または終了位置に行ったときに発生します。
touchEnd(swiper, event)
Event will be fired when user release Swiper. Receives touchend event as an arguments.
ユーザーがSwiperを離すとイベントが発生します。引数としてtouchendイベントを受け取ります。
touchMove(swiper, event)
Event will be fired when user touch and move finger over Swiper. Receives touchmove event as an arguments.
ユーザーがSwiperにタッチして指を動かしたときにイベントが発生します。touchmoveイベントを引数として受け取ります。
touchMoveOpposite(swiper, event)
Event will be fired when user touch and move finger over Swiper in direction opposite to direction parameter. Receives touchmove event as an arguments.
イベントは、ユーザーがSwiperにタッチして指を動かしたときに、directionパラメータと反対の方向に発射されます。touchmoveイベントを引数として受け取ります。
touchStart(swiper, event)
Event will be fired when user touch Swiper. Receives touchstart event as an arguments.
イベントは、ユーザーがSwiperにタッチして指を動かしたときに、directionパラメータと反対の方向に発射されます。touchmoveイベントを引数として受け取ります。
transitionEnd(swiper)
Event will be fired after transition.
遷移後にイベントが発生します。
transitionStart(swiper)
Event will be fired in the beginning of transition.
イベントはトランジションの開始時に発生します。
update(swiper)
Event will be fired after swiper.update() call
イベントはswiper.update()の呼び出し後に発生します。
