0

次と前の矢印を使用して画像を切り替えようとしており、次の画像をフェードするために next() を使用していますが、画像が残っていない場合、明らかに最初の画像からリサイクルされません。このコードを機能させ、そのクラスで画像要素の最後に到達した後、次のボタンを最初の画像に移動させる方法。

私のコード:

$('.nextImage').live('click',function(){
    $('.main-image .zoom:visible').fadeOut(800);
    $('.main-image .zoom:visible').next().fadeIn(800);
});
4

1 に答える 1

2

次の要素があるかどうかをテストし、そうでない場合は最初に戻ります。

$('.nextImage').on('click',function(){  // .live() is deprecated
    var $img = $('.main-image .zoom:visible').last(),  // just want one
        $next = $img.next();
    if (0==$next.length) {
       $next = $img.siblings().first();
    }
    $img.fadeOut(800);
    $next.fadeIn(800);
});

http://jsfiddle.net/tAChA/

于 2012-08-31T19:32:32.000 に答える