Atributo animation-direction CSS

Definición y uso

animation-direction Define si la propiedad debe reproducir la animación alternativamente en sentido inverso.

Si el valor de animation-direction es "alternateSi se configura la animación para que se reproduzca solo una vez, esta propiedad no tiene efecto.

Comentarios:Si se configura la animación para que se reproduzca solo una vez, esta propiedad no tiene efecto.

Véase también:

Tutorial de CSS3:Animación de CSS

Manual de referencia de HTML DOM:Propiedad animationDirection

Ejemplo

Pausar animación:

div {
  animation-direction: alternate;
}

Prueba por tu cuenta

Sintaxis de CSS

animation-direction: normal|alternate;
Valor Descripción Pruebas
normal Valor por defecto. La animación debe reproducirse normalmente. Pruebas
alternate La animación debe reproducirse alternativamente en sentido inverso. Pruebas

Detalles técnicos

Valor por defecto: normal
Herencia: no
Versión: CSS3
Sintaxis de JavaScript: object.style.animationDirection="alternate"

Compatibilidad del navegador

Los números en la tabla indican la primera versión del navegador que admite completamente la propiedad.

Los números con -webkit-、-moz- o -o- indican la primera versión que utiliza el prefijo.

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-