#animation-timing-function
Legt fest, wie die Werte zwischen dem Start und dem Ende der Animation berechnet werden.
default animation-timing-function: ease;
Die Animation beginnt langsam, beschleunigt sich in der Mitte und verlangsamt sich am Ende.
animation-timing-function: ease-in;
Die Animation beginnt langsam und wird bis zum Ende hin immer schneller.
animation-timing-function: ease-out;
Die Animation beginnt schnell und verlangsamt sich dann allmählich bis zum Ende.
animation-timing-function: ease-in-out;
Wie ease, aber stärker ausgeprägt.
Die Animation beginnt schnell und verlangsamt sich allmählich bis zum Ende.
animation-timing-function: linear;
Die Animation hat eine *konstante Geschwindigkeit.
animation-timing-function: step-start;
Die Animation springt sofort in den Endzustand.
animation-timing-function: step-end;
Die Animation bleibt im Anfangszustand bis zum Ende, wenn sie sofort zum Endzustand springt.
animation-timing-function: steps(4, end);
Durch die Verwendung von steps() mit einer Ganzzahl kann man eine bestimmte Anzahl von Schritten definieren, bevor man das Ende erreicht. Der Zustand des Elements ändert sich nicht allmählich, sondern springt von Zustand zu Zustand in einzelnen Augenblicken.
- Virtuelle private Netzwerke (VPN): Was steckt hinter dieser Technologie? - 30. August 2022
