jQuery - возобновить продолжительность анимации

Question

Я хочу, чтобы анимационная пауза была window.active == false и возобновлена, когда window.active == true.

var time = 15; 
     if(window.active == true){ 
      time=time-1;  
      $('#bar').animate({ 
       width:'100%' 
      }, 15000);     
     } else { 
      var myDiv = $("#bar"); 
      myDiv.clearQueue(); 
      myDiv.stop(); 
      time=time; 
     } 

Проблема в том, что, когда анимация возобновляется, она возобновляет длительность, и она становится более медленной.

Answer 1

функция stop() сбросить анимацию, а при повторной перезагрузке анимация - это снова оригинал. Чтобы решить эту проблему, вы можете сделать отметку времени и рассчитать оставшуюся дюранцию ​​при возобновлении.

var time = 15, duration=15000, remainingDuration, iniAnimation, pauseAnimation; 
if(window.active == true){ 
    time=time-1; 
    if(pauseAnimation) { 
     remainingDuration -= pauseAnimation-iniAnimation; 
     $('#bar').animate({ 
     width:'100%' 
     }, remainingDuration); 
     pauseAnimation = null; 
     iniAnimation = new Date().getTime(); 
    } 
    else { 
     $('#bar').animate({ 
     width:'100%' 
     }, duration); 
     remainingDuration = duration; 
     iniAnimation = new Date().getTime(); 
    }      
} else { 
     var myDiv = $("#bar"); 
     myDiv.clearQueue(); 
     myDiv.stop(); 
     pauseAnimation = new Date().getTime(); 
     time=time; 
}