velocity.js Dauer unterschiedlich, wenn animierte zwei Eigenschaften

Question

Ich versuche, Skalierung und Rotation eines Elements zu animieren (was funktioniert), aber die Skalierung Animation erfolgt weit vor der Rotation beendet. Das Div dreht sich weiter, während die Skalenanimation nach etwa 300 ms abgeschlossen ist. Ich habe keine Syntax gefunden, in der man die Dauer für separate Eigenschaften angeben kann (ich dachte, die Dauer sollte für alle angegebenen Eigenschaften sein). Hier ist der Code, alle Tipps geschätzt:

$('#el').velocity({ 
    rotateZ:[ 1440, 'easeInOut', 0 ], 
    scale:[ 1, 'spring', 0 ] 
},{ 
    duration:1000 
}); 

Answer 1

Technisch gesehen ist die Animation nicht bei 300ms endet, es ist nur die Feder Lockerung macht es aussehen. Die Federbeschleunigungsfunktion bewegt sich im zweiten Feld der Animation nicht viel. Versuchen Frühjahr mit einigen anderen Parametern Lockerung, wie:

$('#el').velocity({ 
    rotateZ:[ 360, 'easeInOut', 0.001 ], 
    scale:[ 1, [20,0.2], 0.001 ] 
},{ 
    duration:1000 
}); 

Beachten Sie auch, dass Geschwindigkeit 0 Werte als undefinierter Parameter zu handhaben scheint, so verwende ich 0.001 statt. (es macht nur bei nachfolgenden Animationen einen Unterschied)