1

2 つのフクロウ カルーセルを同期して、スライドを同時に同じ方法で変更しようとしています。カルーセルはループします。これを使用する場合：

$("#slider").on('change.owl.carousel', function(event) {
    $("#text_slider").trigger('to.owl.carousel', [event.item.index,0,true]);
})

アイテムの最後に到達した後の 2 番目のカルーセルは、本来のように前進せず (ループされます)、最初のアイテムに戻ります。

ドラッグも無効にして、これを試しました：

$('#slider .owl-prev').click(function() {
    $("#text_slider").trigger('prev.owl.carousel');
})
$('#slider .owl-next').click(function() {
    $("#text_slider").trigger('next.owl.carousel');
})

最初は問題ないように見えます...しかし、自動再生も有効になっており、両方のカルーセルで同じです（autoplay:true, autoplayTimeout:4000, smartSpeed:400）。カルーセルを1〜2分間見ると、スライドの変更の間に時間間隔が発生し、非同期に動き始めます。間隔は大きくなく、1秒未満ですが、本当に不要です:(

prev.owl.carouselアイテムを前next.owl.carouselに変更するときと次のアイテムに変更するときにトリガーを呼び出し、2番目のカルーセルで自動再生を無効にできれば素晴らしいと思いますが、それを行う方法が見つかりませんでした:(

レスポンシブでループと同期が可能な別のスライダー プラグインの使用に関する提案を歓迎します。

4

1 に答える 1