jQuery - How to set width during it is increasing?

I am trying to use following codes to create a continuely a开发者_开发百科nimatation

var running = function() {
  w = jQuery('#belt').width();
  if(w >= 940)
    jQuery('#belt').width(0);

  jQuery('#belt').animate({width: '+=235px'}, duration, 'linear');
}

jQuery(document).everyTime(duration, running);

But it doesn't work, the width didn't get reset but continuely increasing, did i write wrong?

You can simply use the complete parameter for jQuery#animate() to define a function that should be executed when the animation is completed. Add some recursion, et voilà:

jQuery.fn.continuousAnimation = function() {
  var $this = this;
  return $this.animate({ 'width': '+=235px' }, 400, 'linear', function() {
    $this.width(0).continuousAnimation();
  });
};

jQuery('#belt').continuousAnimation();

Demo: http://jsfiddle.net/mathias/dRpgv/

what is the value of duration??

better to use

setInterval(function() { // refresh list }, 5000)

where the second parameter is the number of milliseconds.

Note on everyTime

If really you want to use everyTime, you'll need to make your first parameter a string, that is:

$(document).everyTime("5s", function(i) { }, 0);

no such need of using 'linear' if your animate sudden stops then check check the duration, increase animation time or use slow

jQuery('#belt').animate({width: '+=235px'}, 'slow');