Der "abgehackte" Effekt wird erzeugt, weil animation-timing- Funktion (Leichtigkeit), sollten Sie es auf linear
setzen.
Es macht auch keinen Sinn, die Zustände auf 20%, 40% festzulegen ... Für die Keyframe-Animation können Sie einfach den Endzustand mit dem Schlüsselwort "to" angeben:
Beachten Sie, dass Sie abhängig von den zu unterstützenden Browsern auch Anbieterpräfixe verwenden müssen. Weitere Informationen finden Sie unter canIuse .
Meinst du es so?
Die Änderungen bestehen darin, eine Timing-Funktion hinzuzufügen, die linear ist (und nicht eine Leichtigkeit) und die Animation ein wenig klarer zu machen, was vor sich geht.
Tags und Links css css3 css-animations