2

私はjqueryに少し慣れていないので、2つの画像をフェードインおよびフェードアウトする小さなアニメーションをプログラムすることができました。

今の私の問題は、それがサイクルを一周した後、それがただ停止するということです。それが終わりに達したとき、私はそれを最初からやり直す必要があります。続行する必要があります。

これがコードです

$(document).ready(function() {
    $('img.banner1').fadeOut(5000);
    $('img.banner2').delay(1000).fadeIn(5000);
    $('img.banner2').delay(1000).fadeOut(5000);
    $('img.banner1').fadeIn(5000).delay(1000);
});
4

2 に答える 2

6

このコードは、最後のフェードインを開始してから1000msの遅延後に関数を再起動します。そのバナーをフェードインするのに5000msかかるので、もっと長い遅延が必要かもしれません...

function animateBanners() {
    $('img.banner1').fadeOut(5000);
    $('img.banner2').delay(1000).fadeIn(5000);
    $('img.banner2').delay(1000).fadeOut(5000);
    $('img.banner1').fadeIn(5000).delay(1000).queue(animateBanners);
}

$(document).ready(function() {
    animateBanners();
});
于 2012-12-20T18:36:24.327 に答える
0

それを関数に移動し、setIntervalで呼び出すことができます。

function AnimateBanners() {
    $('img.banner1').fadeOut(5000);
    $('img.banner2').delay(1000).fadeIn(5000);
    $('img.banner2').delay(1000).fadeOut(5000);
    $('img.banner1').fadeIn(5000).delay(1000);
}

$(document).ready(function() {
    setInterval(AnimateBanners, 10000); //Will run every 10 seconds
});

</ p>

于 2012-12-20T18:38:26.673 に答える