开发者

How to repeat executing a group elements in jQuery?

I have a problem. I am new to jQuery, and do not understand how can I repeat of my created animation. Here example of my code:

$("#text_rotator1_1").fadeIn(3000,function(){
    $("#tex开发者_如何学运维t_rotator1_2").fadeIn(3000, function(){
        $("#text_rotator1_3").fadeIn(3000, function() {
            $("#text_rotator1_4").fadeIn(3000, function() {
            $("#text_rotator1_1").fadeOut(1000);
            $("#text_rotator1_2").fadeOut(1000);
            $("#text_rotator1_3").fadeOut(1000);
            $("#text_rotator1_4").fadeOut(1000, function() {

            });

            });
        });
    });
});

When all 4 elements are faded out, then I want to repeat fade in all elements. Like some while cycle... I think, you understand me :)


Wrap it inside a function, and call that function as your last callback:

function start(){
$("#text_rotator1_1").fadeIn(3000,function(){
    $("#text_rotator1_2").fadeIn(3000, function(){
        $("#text_rotator1_3").fadeIn(3000, function() {
            $("#text_rotator1_4").fadeIn(3000, function() {
            $("#text_rotator1_1").fadeOut(1000);
            $("#text_rotator1_2").fadeOut(1000);
            $("#text_rotator1_3").fadeOut(1000);
            $("#text_rotator1_4").fadeOut(1000, start);

            });
        });
    });
});
}
start();

example: http://jsfiddle.net/niklasvh/BYRkp/


I guess i'd do something like this, using custom events:

$('.text_rotators').bind('fadeMeIn',function(){
  $(this).fadeIn("slow",function(){
      $(this).trigger('fadeMeOut');
  });
}).bind('fadeMeOut',function(){
      $(this).fadeOut("slow",function(){
      $(this).trigger('fadeMeIn');
  });
});

$('.text_rotators').trigger('fadeMeIn');
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜