0

私はこのコードを持っており、一度に1つのdivをフェードインおよびフェードアウトするのに最適です。一度に2つのdivをフェードアウトし、次の2つに置き換える必要があります。

$(function() {
    // Set first div to show
    $('.testimonials div:first').show();

    // Begin the loop, fade out, find next div, fade that div in, end the process and append back to main div.
    setInterval(function() {
        $('.testimonials div:first-child').fadeOut().next('div').fadeIn().end().appendTo('.testimonials');
    }, 5000);
)};

スクリプトを改善しようとしました：

フェードは機能しています。最初の2つはフェードアウトし、次の2つはフェードアウトします。しかし、ループすることはありません！

$(function() {
    // Set first div to show
    $('.testimonials .quote:lt(2)').show();

    // Begin the loop, fade out, find next div, fade that div in, end the process and append back to main div.
    setInterval(function() {
        $('.testimonials .quote').slice(0,2).fadeOut().nextAll('.quote').slice(3,4).(.fadeIn().end().appendTo('.testimonials');
    }, 5000);
)};

フェードは機能しています。最初の2つはフェードアウトし、次の2つはフェードアウトします。しかし、ループすることはありません！

4

2 に答える 2

2

やや異なるアプローチ：

$(function () {
  (function anim(num, delay) {
    $('.testimonials .quote').slice(0, num).fadeIn().delay(delay).fadeOut().promise().done(function () {
      $('.testimonials').append(this);
      anim(num, delay);
    });
  }(2, 2000)); // change these values to fade another number of elements, or
               // have a longer delay between the fades
});

デモ： http： //jsbin.com/ivuyex/5/

于 2012-11-14T09:33:18.087 に答える
0

setIntervalを使用すると、常に最初の2つをフェードアウトし、3番目と4番目をフェードインします。ループしますが、最初の反復の後、変更するものは何もありません。

最初に状態を設定した後、fadeToggle（）を試すことができます。

setInterval(function() {
    $('.testimonials .quote').fadeToggle().end().appendTo('.testimonials');
 }, 5000);
于 2012-11-14T09:20:31.300 に答える