callback для jquery анимации для нескольких элементов

Question

Как вы можете видеть на this Fiddle, я анимирую более одного элемента сразу, , что происходит, как я желаю. Но на следующем шаге я хотел бы сделать что-то еще, анимация для всех элементов окончена. Который не кажется возможным, используя полную функцию, потому что он запускается для КАЖДОЙ завершенной анимации (3 элемента, 3 раза полный обратный вызов). JQuery .animate() API также говорит:

Если несколько элементов анимации, обратный вызов выполняется один раз в совпавшего элемента, а не один раз для анимации в целом.

Итак, вы знаете, что я могу сделать, чтобы событие было запущено, когда закончилась каждая анимация?

Answer 1

...animate(...).promise().done(function(){console.log("animate complete!")}) 

Answer 2

Там вы идете, просто добавили простой счетчик :)

http://jsfiddle.net/Pz5YB/24/

Answer 3

Вы можете создать переменную и сосчитать каждый раз, когда анимация закончена. Если он равен 3 (или любой другой номер, который вы хотите), вызовите другую функцию. Смотрите эту jsfiddle

function animateAll(){ 
if(flag) return; 
flag = true; 
//$('.list-wrapper').scrollLeft(w); // not sure why you need this 
//$('.table-wrapper').scrollLeft(w); // or this 
$('.list-wrapper, .table-wrapper').animate({ 
    scrollLeft: 2*w, 
    }, function(){ 
     countAni++; 
     console.log('finish'); 
     if(countAni == 3) finishAni() 
    }  
); 
function finishAni(){ 
    alert('whoohoo ready'); 
    flag = false; 
} 

Answer 4

В вашем случае, вы можете просмотреть в настоящее время анимированные с:

$(':animated').length 

и полного обратного вызова:

if($(':animated').length==1) 
    console.log('whoohoo ready'); 

http://jsfiddle.net/Pz5YB/25/

Answer 5

The A ccepted ответ был немного непонятен мне вначале, как обрабатывать несвязанные элементы. В конце концов я пришел к этому ответу:

$.when(
    $someElement.animate(...).promise(), 
    $someOtherElement.animate(...).promise() 
).done(function() { 
    console.log("whoohoo ready"); 
});