0

Possible Duplicate:
Jquery Continuously Loop Animation

I want this animation to restart when the div timer reaches 940px. So far I have this:

$('.timer').animate({'width':940}, {queue:false, duration:5000, easing: 'linear'});
if ($('.timer').width() == 940){
    $('.timer').width() == 0;
    $('.timer').animate({'width':940}, {queue:false, duration:5000, easing: 'linear'});
}
Community
  • 1
  • 1
CIRCLE
  • 4,501
  • 5
  • 37
  • 56

1 Answers1

1

Restarting animated loop:

$(".timer").bind("animation.loop", function(){
    $(this).animate({width: 940}, 5000, function(){
        $(this).animate({width: 0}, 5000, function(){
            $(this).trigger("animation.loop");
        });
    });
}).trigger("animation.loop");

Do the animation, hard reset, animate again:

$(".timer").bind("animation.loop", function(){
    $(this).animate({width: 940, easing: 'linear'}, 5000, function(){
        $(this).css("width", 0).trigger("animation.loop");
    });
}).trigger("animation.loop");
M K
  • 9,138
  • 7
  • 43
  • 44
  • I was looking for it to scale back from zero width like a seamless loop from the same animation. – CIRCLE Jan 25 '13 at 21:54
  • Thank you maximkott, but the problem is that I was not looking for it to retract but start from zero equaly like the first time it is animated. – CIRCLE Jan 25 '13 at 22:06
  • @user2011284 is that what you mean? – M K Jan 25 '13 at 22:09
  • I think i've got it. but now I can't put the easing: 'linear' to work. $(".timer").bind("animation.loop", function(){ $(this).animate({width: 940}, 5000, function(){ $(this ).css( "width","0" ); $(this).trigger("animation.loop"); }); }).trigger("animation.loop"); – CIRCLE Jan 25 '13 at 22:14
  • @user2011284 I've edited it a bit – M K Jan 25 '13 at 22:19
  • It's exacly that. Thank you so much! – CIRCLE Jan 25 '13 at 22:44
  • @user2011284 Glad I could help! )) Can you please select the checkmark-sign, on the left of my answer. – M K Jan 25 '13 at 22:49