CSS animation-delay Özelliği
- Önceki Sayfa animation
- Sonraki Sayfa animation-direction
Tanım ve Kullanım
animation-delay
Özelliği, animasyonun ne zaman başlayacağını tanımlar.
animation-delay değeri saniye veya milisaniye olarak ölçülür.
İpucu:Negatif değerlere izin verilir, -2s animasyonun hemen başlamasına olanak tanır, ancak 2 saniye atlayarak animasyon döngüsüne girer.
Ayrıca bkz.:
CSS3 Eğitim Seti:CSS Animasyon
HTML DOM Referans Kılavuzu:animationDelay Özelliği
Örnek
Örnek 1
İki saniye bekleyin, ardından animasyon başlasın:
div { animation-delay: 2s; }
Örnek 2
Negatif değerler, lütfen animasyonun 2 saniye atlayarak animasyon döngüsüne girdiğini unutmayın:
div { animation-delay: -2s; }
CSS Dilbilgisi
animation-delay: time;
Değer | Açıklama | Test |
---|---|---|
time | Opsiyonel. Animasyonun başlamadan önce bekleyeceği süreyi saniye veya milisaniye olarak tanımlar. Varsayılan değeri 0'dır. | Test |
Teknik Ayrıntılar
Varsayılan Değer: | 0 |
---|---|
Devralabilirlik: | hayır |
Sürüm: | CSS3 |
JavaScript Dilbilgisi: | object.style.animationDelay="2s" |
Tarayıcı Desteği
Tablodeki rakamlar, bu özelliği tam olarak destekleyen ilk tarayıcı sürümünü belirtir.
Ile -webkit-、-moz- veya -o- ön ekleri olan sayılar, ön ekli olan ilk sürümü kullanır.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
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- |
- Önceki Sayfa animation
- Sonraki Sayfa animation-direction