Örnek
Bir kez animasyon Do sonra geriye animasyon yapın:
div {
-webkit-animation-direction: alternate; /* Chrome, Safari,
Opera */
animation-direction: alternate;
} Kendin dene " Tanımı ve Kullanımı
Animasyon-yönü özelliği, bir animasyon ters yönde veya alternatif döngülerinde oynamak olup olmadığını belirler.
| Varsayılan değer: | normal |
|---|---|
| Miras: | no |
| canlandırılabilir: | no. Read about animatable |
| Versiyon: | CSS3 |
| JavaScript sözdizimi: | object .style.animationDirection="reverse" Try it |
Tarayıcı Desteği
Tablodaki rakamlar tam özelliğini destekleyen ilk tarayıcı sürümü belirtin.
Sayılar -moz-, -webkit- ardından veya önek ile çalıştı ilk sürümü belirtmek -O-.
| özellik | |||||
|---|---|---|---|---|---|
| animation-direction | 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- |
CSS sözdizimi
animation-direction: normal|reverse|alternate|alternate-reverse|initial|inherit;Mülkiyet Değerler
| değer | Açıklama | Oynat |
|---|---|---|
| normal | Varsayılan değer. animasyon normal şekilde oynanması gerektiğini | Oynat " |
| reverse | Animasyon ters yönde oynaması gereken | Oynat " |
| alternate | Animasyon, normal olarak, her tek zaman oynanacak (1,3,5,etc..) ters yönde her da zaman ve (2,4,6,etc...) | Oynat " |
| alternate-reverse | Animasyon ters yönde her tek zaman oynanacak (1,3,5,etc..) normal bir yönde her da zaman ve (2,4,6,etc...) | Oynat " |
| initial | varsayılan değerine bu özelliği ayarlar. İlk hakkında okuyun | |
| inherit | üst öğesinden bu özelliği devralır. Yaklaşık miras oku |
Not: "reverse" ve "alternate-reverse" değerleri Safari'de desteklenmez.
İlgili Sayfalar
CSS3 öğretici: CSS3 Animasyonlar
HTML DOM referansı: animationDirection property