3

プロジェクトで Swiper という jQuery スライダーを使用しています。

http://www.idangero.us/sliders/swiper/

私はプログラミング（js / jquery）が初めてです。スライダーの最初のスライドがアクティブになるたびに、関数、より具体的にはいくつかの jquery コードを実行したいと考えています。彼らの API がこれを可能にしていると思いますが、使い方がわかりません。誰かが助けてくれれば、私は感謝します。API は次のとおりです。

http://www.idangero.us/sliders/swiper/api.php

ありがとう。

4

2 に答える 2

13

I build a little demo in jsfiddle to demonstrate how to react on slide events with "swiper":

http://jsfiddle.net/KhgFX/2/

Use the Event-Callback functions by swiper, as mentioned in the API-docu.

$(document).ready(function () {

        $(function () {
            var mySwiper = $('.swiper-container').swiper({
                mode: 'horizontal',
                watchActiveIndex: true,
                loop: true,
                onSlideChangeStart: function (swiper) {
                    console.log('slide change start - before');
                    console.log(swiper);
                    console.log(swiper.activeIndex);
                    //before Event use it for your purpose
                },
                onSlideChangeEnd: function (swiper) {
                    console.log('slide change end - after');
                    console.log(swiper);
                    console.log(swiper.activeIndex);
                    //after Event use it for your purpose
                    if (swiper.activeIndex == 1) {
                        //First Slide is active
                        console.log('First slide active')
                    }
                }
            });
        })

    });
于 2013-09-10T17:55:53.633 に答える
1

他の jsfiddle の例はもう機能していないようです。これが機能することを確認するために適切なライブラリをセットアップしたい他の人については、次を参照してください。

http://jsfiddle.net/kp8a8ugd/1/

var swiper = new Swiper('.swiper-container'); //just a simple setup
于 2015-07-10T23:45:39.883 に答える