Egenskaben animation-timing-function

Egenskaben animation-timing-function indstiller hastigheden for ændring (acceleration) af animationen. For eksempel, først langsomt, derefter hurtigt, derefter langsomt osv.

Syntaks

Værdier

Værdi	Beskrivelse
ease	Først langsomt, derefter hurtigt, til sidst igen langsomt.
ease-in	Begynder langsomt og accelererer gradvist.
ease-out	Begynder hurtigt og stopper gradvist.
ease-in-out	Først langsomt, derefter hurtigt, til sidst igen langsomt. Forskellig fra ease i hastighed.
linear	Altid den samme hastighed.
step-start	Ingen animation, egenskaben antager straks den endelige værdi.
step-end	Ingen animation, egenskaben venter i den tid, der er angivet i animation-duraton, og antager derefter øjeblikkeligt den endelige værdi.
steps	Egenskabens værdi ændres med spring.
cubic-bezier	En Bezier-kurve, der kan definere en vilkårlig animation. Se generatoren for Bezier-kurver.

Standardværdi: ease.

Sammenligning af forskellige værdier

Før musen over blokkene nedenfor for at se alle typer af timing-funktioner i aktion:

Se også