Style animation özelliği

Tanım ve kullanım

animation Bu özellik, altı animasyon özelliğinin kısaltma özelliğidir:

Açıklama:Her zaman belirleyin animationDuration özellikAksi takdirde süresi 0 olacaktır ve asla oynatılmayacaktır.

Örnek

Kısaltma özelliklerini kullanarak <div> elementinin animasyonunu değiştirin:

document.getElementById("myDIV").style.animation = "mynewmove 4s 2";

Kişisel olarak deneyin

Gramer

animation özelliğini döndür:

object.style.animation

animation özelliğini ayarla:

object.style.animation = "name duration timingFunction delay iterationCount direction fillMode playState"

Özellik değeri

Değer Açıklama
animationName Seçiciye bağlanacak anahtar kare adlarını belirler.
animationDuration Animasyonun tamamlanması için gerekli saniye veya milisaniyeyi belirler.
animationTimingFunction Animasyonun hız eğrisini belirler.
animationDelay Animasyonun başlamadan önceki gecikmeyi belirler.
animationIterationCount Animasyonun kaç kez oynatılacağını belirler.
animationDirection Animasyonun dönüşümde ters oynatılıp oynatılmayacağını belirler.
animationFillMode Animasyonun çalışma süresi dışında uygulanan değeri belirler.
animationPlayState Animasyonun çalışma dışında uygulanan değeri belirler.
initial Bu özelliği varsayılan değerine ayarlar. Bakınız initial.
inherit Bu özelliği ebeveyn elemanından miras alır. Bakınız inherit.

Teknik ayrıntılar

Varsayılan değer: none 0 ease 0 1 normal none running
Dönüş değer: Dizgi, elemanın animation Özellikleri.
CSS Sürümü: CSS3

Tarayıcı Desteği

animation CSS3 (1999) özelliğidir.

Tüm tarayıcılar tamamen destekler:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
Destek Destek Destek Destek Destek 11

İlgili sayfalar

CSS Referans Kılavuzu:animation Özellikleri