CSS animation-duration Eigenschap

Definition and usage

animation-duration De eigenschap definieert de tijd in seconden of milliseconden die nodig is om een cyclus van de animatie te voltooien.

See also:

CSS3 Tutorial:CSS animatie

HTML DOM Reference Manual:animationDuration property

Example

Geef een naam op voor de @keyframes animatie:

div {
  animation-duration: 3s;
}

Try it yourself

CSS syntax

animation-duration: time;
Value Description
time Definieert de tijd die nodig is om de animatie te voltooien. De standaardwaarde is 0, wat betekent dat er geen animatie-effect is.

Technical details

Default value: 0
Inheritability: no
Versie: CSS3
JavaScript syntax: object.style.animationDuration="3s"

Browserondersteuning

De cijfers in de tabel vermelden de eerste browserversie die de eigenschap volledig ondersteunt.

Numeren met -webkit-, -moz- of -o- voorafgaand, representeren de eerste versie die de prefix gebruikt.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
43.0
3.0 -webkit-		 10.0 16.0
5.0 -moz-		 9.0
4.0 -webkit-		 30.0
15.0 -webkit-
12.0 -o-