Właściwość czasu trwania animacji CSS
Przykład
Określ, że animacja powinna zakończyć jeden cykl w ciągu 3 sekund:
div {
animation-duration: 3s;
}
Definicja i użycie
Właściwość animation-duration
określa, jak długo animacja powinna zająć jeden cykl.
Domyślna wartość: | 0 |
---|---|
Dziedziczny: | nie |
Animowalny: | nie. Przeczytaj o animacji |
Wersja: | CSS3 |
Składnia JavaScript: | obiekt .style.animationDuration="3s" |
Obsługa przeglądarki
Liczby w tabeli określają pierwszą wersję przeglądarki, która w pełni obsługuje tę właściwość.
Liczby, po których następuje -webkit-, -moz- lub -o- określają pierwszą wersję, która działała z przedrostkiem.
Property | |||||
---|---|---|---|---|---|
animation-duration | 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- |
Składnia CSS
animation-duration: time|initial|inherit;
Wartości nieruchomości
Value | Description | Play it |
---|---|---|
time | Specifies the length of time an animation should take to complete one cycle. This can be specified in seconds or milliseconds. Default value is 0, which means that no animation will occur | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Powiązane strony
Samouczek CSS: animacje CSS
Dokumentacja HTML DOM: właściwość animationDuration