title: I want to animate div when width not 0
body: <p>I am having this problem I want to animate the div from 100% to 0 using velocity js. I want it to animate every time the width not equal 0. The width of the div is updated automatically using setInterval process. This interval process is running forever and will update the width of the div every 3 seconds. The function of velocity js or other animation plugin is to just make it 0% in width.</p>
  
  <p>My code is something like this.</p>
  
  <pre><code>    // THIS IS A BIDDING PROCESS
  
  var progressBar = $("#progressBar");
  var scenario = 3
  var width = 265;
  var processDuration = 60000;
  var processDelay = 3000;
  var time_per_scenario = (processDuration / scenario);
  var width_per_processDelay = (width / (processDuration / processDelay));
  
  // Call the  animateProgressBar for first time animation;
  animateProgressBar();
  
  setInterval(function(){
      if(scenario != 0) {
           if(time_per_scenario != 0) {
              time_per_scenario -= 1000;
              width -= width_per_processDelay;
           } else {
              scenario--;
              width = 265;
              time_per_scenario = 20000;
              animateProgressBar();
           }
      } else {
          scenario = 3;
      }
  }, processDelay);
  
  function animateProgressBar() {
  
      progressBar.attr("style", "width: " + width);
  
      console.log("animateProgressBar Again with scenario: " + scenario);
  
      if(scenario == 0 ) {
  
          progressBar
          .velocity({ width: width}, { duration: 1 })
          .velocity({ width: 0 }, { duration: time_per_scenario })
          .velocity({ width: width }, { duration: 1 })
          .velocity({ width: 0 }, { duration: time_per_scenario, })
          .velocity({ width: width}, { duration: 1 })
          .velocity({ width: 0 }, { duration: time_per_scenario, });
  
      } else if(scenario == 1 ){
          progressBar
          .velocity({ width: width }, { duration: 1 })
          .velocity({ width: 0 }, { duration: time_per_scenario, })
          .velocity({ width: width}, { duration: 1 })
          .velocity({ width: 0 }, { duration: time_per_scenario, });
      } else {
          progressBar
          .velocity({ width: width }, { duration: 1 })
          .velocity({ width: 0 }, { duration: time_per_scenario });
      }
  };
  </code></pre>
  
  <p>The problem with velocity js is that it just animate 1 time even if it is inside the setInterval process it wont do the animation. Why is it happening?</p>