Properti penundaan animasi CSS
Contoh
Mulai animasi setelah 2 detik:
div {
animation-delay: 2s;
}
Lebih banyak contoh "Coba Sendiri" di bawah ini.
Definisi dan Penggunaan
Properti animation-delay
menentukan penundaan untuk memulai animasi.
Nilai penundaan animasi ditentukan dalam detik (dtk) atau milidetik (md).
Nilai bawaan: | 0 detik |
---|---|
Diwarisi: | tidak |
Animasi: | tidak. Baca tentang animasi |
Versi: kapan: | CSS3 |
Sintaks JavaScript: | objek .style.animationDelay="1s" |
Dukungan Peramban
Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung properti.
Angka yang diikuti oleh -webkit-, -moz-, atau -o- menentukan versi pertama yang berfungsi dengan awalan.
Property | |||||
---|---|---|---|---|---|
animation-delay | 43.0 4.0 -webkit- |
10.0 | 16.0 5.0 -moz- |
9.0 4.0 -webkit- |
30.0 15.0 -webkit- 12.0 -o- |
Sintaks CSS
animation-delay: time|initial|inherit;
Nilai properti
Value | Description | Play it |
---|---|---|
time | Optional. Defines the number of seconds (s) or milliseconds (ms) to wait before the animation will start. Default value is 0. Negative values are allowed. If you use negative values, the animation will start as if it had already been playing for N seconds/milliseconds. | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Lebih Banyak Contoh
Contoh
Menggunakan nilai negatif. Di sini, animasi akan mulai seolah-olah sudah diputar selama 2 detik:
div {
animation-delay: -2s;
}
Halaman Terkait
Tutorial CSS: Animasi CSS
Referensi DOM HTML: properti animationDelay