Ich habe nicht animiertes Element als Standard. Es gibt auch einen Auslöser, mit dem ich & amp; Aus Animation für dieses Element. Die Animation selbst ist sehr einfach: bewegt Element von links nach rechts und zurück.
Wenn ich die Animation stoppe, geht mein Element offensichtlich in die Ausgangsposition zurück. Aber es geht plötzlich zurück, nicht glatt. Es ändert also nur seine Position von der, als ich die Animation auf die erste abstellte. Meine Frage ist: Gibt es einen Weg, um es reibungslos zu stoppen, wenn ich die Animation ausschalte, geht es zurück zur Ausgangsposition, aber glatt / animierend.
Hier ist mein Element und meine Animation: Ссылка
HTML:
%Vor%CSS:
%Vor%Ich hatte gerade das gleiche Problem und habe es gelöst, indem ich keine Animation benutzt habe und es funktioniert perfekt! Schau dir meine Lösung an: Also hatte ich diesen Spatel, den ich bewegen musste, wenn ich nur darüber schwebte, und ich wollte, dass er sanft zurückging, also tat ich Folgendes:
%Vor%Viel Glück!
Lesen Sie Diese StackOverflow-Frage .
Sie werden diese Antwort nicht mögen, aber die Realität ist das CSS3 Animationen sind nicht wirklich nützlich, um dies zu erreichen. Damit das funktioniert müsste viel von Ihrem CSS in Ihrem Javascript replizieren Art zerstört den Punkt (Wie zum Beispiel in diesem eng verwandten Antworten Geschwindigkeit der Animation ändern CSS3? ). Um es wirklich reibungslos stoppen zu können, wäre es am besten, wenn Sie die Animation auf einer Plattform wie der Greensock Animationsbibliothek Das bietet alle Werkzeuge, die Sie benötigen, um es reibungslos zu machen Stopp statt plötzlich zu stoppen.
Es gibt auch eine andere Antwort darunter, die sich bemüht, CSS zu verwenden, Sie können sich das ansehen.