English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
CSS3 animation-iteration-La propiedad count especifica el número de veces que debe reproducirse la animación antes de detenerse.
La siguiente tabla resume el contexto de uso y el historial de versiones de esta propiedad.
| Valor predeterminado: | 1 |
|---|---|
| Aplicable a: | Todos los elementos ::before y ::after Elemento pseudo |
| Herencia: | No hay |
| Se puede crear animación: | No.Por favor, consulte Atributo de animación。 |
| Versión: | CSS3La nueva función |
| Sintaxis de JavaScript: | object object.style.animationIterationCount=3 |
La sintaxis de este atributo es la siguiente:
animation-iteration-count: number | infinite | initial | inherit
El siguiente ejemplo muestra cómo usar animation-iteration-Atributo count.
.box {
width: 50px;
height: 50px;
background: red;
position: relative;
/* Chrome, Safari, Opera */
-webkit-animation-name: moveit;
-webkit-animation-duration: 4s;
-webkit-animation-iteration-count: infinite;
animation-name: moveit;
animation-duration: 4s;
animation-iteration-count: infinite;
}
/* Chrome, Safari, Opera */
@-webkit-keyframes moveit {
from {left: 0;}
to {left: 50%;}
}
@keyframes moveit {
from {left: 0;}
to {left: 50%;}
}Ver aquí‹/›La siguiente tabla describe los valores de este atributo.
| Valor | Descripción |
|---|---|
| number | Especificar el número de veces que debe repetirse la animación. El valor predeterminado es1。No se permite el uso de valores negativos. |
| infinite | La animación se repetirá siempre, es decir, en número infinito. |
| initial | Establecer este atributo en su valor predeterminado. |
| inherit | Si se especifica, el elemento relacionado adopta la animación de su elemento padre-iteration-Valor calculado del atributo count. |
Nota:Puede especificar valores no enteros, como 0.5，0.75Un ciclo de animación es solo una parte de una animación, por ejemplo, 0.5Reproducir la mitad del ciclo de animación.
animation-iteration-Compatibilidad del navegador del atributo count, todos los navegadores principales admiten este atributo.
|
Consulte las siguientes instrucciones:CSS3Animación。
Atributos y reglas relacionados:animation，animation-name，animation-duration，animation-timing-function，animation-delay，animation-direction，animation-fill-mode，animation-play-state，@keyframes。