CODEWITHSUNDEEP
javascriptjqueryhtml
mk_89
mk_89

Reputation: 2742

Animate infinite loop for loading bar

I'm having problems with getting a JQuery code to do an infinite loop.

I basically need my code to go from -100 to 100 and then back to -100 repeating the process again, these are the values I need in order to animate a loading wheel.

I'm still new to JQuery but is the code I'm using

for(var i =0; i< 99; i++){
    $({someValue: -100}).animate({someValue: 100}, {
      duration: 3000,
      easing:'swing', // can be anything
      step: function() { // called on every step
          // Update the element's text with rounded-up value:
          $('#el').text(Math.round(this.someValue));
      }
  });
}

<div id="el"></div>

jsfiddle: http://jsfiddle.net/4v2wK/116/

Upvotes: 0

Views: 279

Answers (1)

James Montagne
James Montagne

Reputation: 78730

The easiest way to create an infinite animation is like this:

function doAnimation(){

  $("selector").animate({/* ... */}, {
      /* ... */
      complete: doAnimation
  });

}

This way when the animation completes it will call the animation again.

Upvotes: 1

Related Questions