Weird анимация очередь

Question

Я играл вокруг с скованной анимацией, и это озадачило меня довольно много

У меня есть только один элемент, анимированы, но эффект «дрожания» остается в нижнюю части очереди ,

.animate().animate().effect('shake',{times:3},10).animate().... 

онлайн упрощенный вариант: http://jsfiddle.net/ottoln/F9xfD/3/

не совсем понимаю, почему ... кто?

скрипка он, вероятно, имел в виду, чтобы ссылка:http://jsfiddle.net/ottoln/F9xfD/

Answer 1

Throw в promise() & done() там, чтобы убедиться, что fx полностью решены, прежде чем продолжить анимацию:

$('#bunda').animate({ 
    marginTop: '+=200', 
    marginLeft: '+=150' 
}, 1300).animate({ 
    marginTop: '-50', 
    marginLeft: '+=100', 
    'background-color': 'darkred' 
}, 1000).effect('shake', { 
    times: 3 
}, 50).promise().done(function(){ 
$(this).animate({ 
    marginTop: '+=300' 
}, 500); 
}); 

пример: http://jsfiddle.net/niklasvh/MtkaY/

Answer 2

Метод effect не находится в очереди точно так же, как и остальные анимированные вызовы, bu t он принимает обратный вызов в качестве параметра, который будет запускаться после завершения эффекта. Вы можете сделать это вместо того, чтобы:

$('#bunda').animate({ 
    marginTop: '+=200', 
    marginLeft: '+=150' 
}, 1300).animate({ 
    marginTop: '-=50', 
    marginLeft: '+=100', 
    'background-color': 'darkred' 
}, 1000).effect('shake', { 
    times: 3, 
}, 50, function() { 
    $('#bunda').animate({ 
     marginTop: '+=300' 
    }, 500); 
}); 

Пример: http://jsfiddle.net/CCw9U/