4

私は次のことにこだわっています:

iDangerous Swiper プラグインを使用していますが、これは問題なく動作します。ただし、同じ iDangerous スワイパーで jQuery のクリック機能も使用したいと考えています。

例えば:

<div id="swiper-container">
 <div class="swiper-slide">(lots of stuff here)</div>
 <div class="swiper-slide">(lots of stuff here)</div>
 <div class="swiper-slide">(lots of stuff here)</div>
 <div class="swiper-slide">(lots of stuff here)</div>
</div>

と :

$('.swiper-slide').click(function() {
//more functionality here
}

問題は、スライダーをスワイプすると jquery .click もトリガーされることです。私の場合、 .click 内の関数が別のページをロードするため、これはちょっと悪いことです。

ただし、プレーンな html リンクを使用しても機能します。ただし、次のページを目に見えないように(URLバーにロードせずに)ロードしたいので、これは私の問題を解決しません。

スライダーを使用するときに上記のjQueryコードをトリガーするのを防ぐ方法を知っている人はいますか?

前もって感謝します :)

4

3 に答える 3

4

現時点ではonClickSlideリスナーはありませんがonClick、たとえば、どのスライドがタップ/クリックされたかだけでなく、スライド内のどの要素も知りたい場合など、柔軟性が向上するため、これは優れています。

基本機能:

var swiper = new Swiper(container, {
    direction: 'horizontal',
    loop: true,
    onClick: (swiper, event) => {
        let div = swiper.clickedSlide; //slide that was clicked
    }
});

拡張機能:

var swiper = new Swiper(container, {
    direction: 'horizontal',
    loop: true,
    onClick: (swiper, event) => {
        let element = event.target;
        //specific element that was clicked i.e.: p or img tag 
    }
});
于 2016-12-29T13:07:24.697 に答える