-4

我怎样才能让这个动画从头开始连续重复? http://jsfiddle.net/philoman/RuX5d/8/

$(document).ready(function() {
var i = 1, dir = 1, curFx = 'fadeIn';
var interval = setInterval(function () {
    if (i == 2 && $('#slide1').is(':visible')) {
        $('#slide1').fadeOut(6000);             
        return;
    }

    $('#slide'+ i)[curFx](1500);

    i = i + 1*dir;

    if (i == 10 || i == -1) {
        dir = (dir == 1)?-1:1;
        curFx = (curFx == 'fadeIn')?'fadeOut':'fadeIn';
    }        
}, 1500);
});
4

3 回答 3

3

使用异步递归。

$(document).ready(function me() {
    $("#slide1").fadeIn(100).delay(100).fadeOut(100, function () {
        (function startFade(slide, step) {
            if ((slide === 1) && (step === -1)) {
                setTimeout(me, 100);
            } else if (slide < 10) {
                $("#slide" + slide)[step === 1 ? "fadeIn" : "fadeOut"](100, function () {
                    startFade(slide + step, step);
                });
            } else {
                startFade(slide - step, -step);
            }
        }(2, 1));
    });
});
于 2013-01-25T16:40:36.717 回答
0

我有一个较短的版本:

function animate(slide){
     slide.fadeIn(500, function() {
        var next = slide.next();
         if(next.length > 0){
              animate(next);
         }
     });
}

$(document).ready(function() {
    animate($('#slide1'));
});

演示:http: //jsfiddle.net/RuX5d/6/

于 2013-01-25T16:40:08.653 回答
0

制作一个回滚到开始的函数。

function loopback(){
...
   //inside your innermost fn:
   loopback();  
...
}
于 2013-01-25T16:38:06.940 回答