Animation Direction

Tetapkan arah animasi

Sintaks

visual="animation-direction:[value]"

Nilai

Nilai	CSS Output	Huraian
normal	animation-direction: normal	Arah normal
reverse	animation-direction: reverse	Arah terbalik
alternate	animation-direction: alternate	Arah berselang
alternate-reverse	animation-direction: alternate-reverse	Berselang terbalik

Contoh

<div visual="animate:bounce animation-direction:alternate">Alternating</div>

Pratonton

Arah Animasi

visual="animation-direction:alternate" - Kawal arah main balik

normal

reverse

alternate

Lihat Kod

<div layout="flex" space="g:medium p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
  <div space="p:small" visual="bg:primary text:white rounded:small animate:spin animation-direction:normal">normal</div>
  <div space="p:small" visual="bg:primary text:white rounded:small animate:spin animation-direction:reverse">reverse</div>
  <div space="p:small" visual="bg:primary text:white rounded:small animate:spin animation-direction:alternate">alternate</div>
</div>