English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
L'attributo CSS3 animation-iteration-count specifica il numero di volte che l'animazione deve essere ripetuta prima di fermarsi.
La seguente tabella riassume l'uso contestuale e la cronologia delle versioni di questo attributo.
| Valore predefinito: | 1 |
|---|---|
| Applicabile a: | Tutti gli elementi::before e::after Elementi pseudo |
| Ereditarietà: | Nessuno |
| Animabile: | No.Vedere: Proprietà di animazione。 |
| Versione: | Nuova funzionalità CSS3 |
| Sintassi JavaScript: | object object.style.animationIterationCount=3 |
La sintassi di questo attributo è la seguente:
animation-iteration-count: number | infinite | initial | inherit
Il seguente esempio dimostra come utilizzare l'attributo animation-iteration-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%;}
}Prova a vedere‹/›La tabella seguente descrive i valori di questa proprietà.
| Valore | Descrizione |
|---|---|
| number | Specificare il numero di volte in cui l'animazione deve essere ripetuta. Il valore predefinito è 1. Non è permesso utilizzare valori negativi. |
| infinite | L'animazione ripeterà sempre, ossia infinite volte. |
| initial | Imposta questa proprietà al suo valore predefinito. |
| inherit | Se specificato, l'elemento correlato adotta il valore calcolato dell'attributo animation-iteration-count del suo elemento padre. |
Attenzione：Puoi specificare valori non interi come 0.5, 0.75, ecc., che rappresentano solo una parte di un ciclo di animazione, ad esempio, un valore di 0.5 riprenderà metà del ciclo di animazione.
Compatibilità dei browser per l'attributo animation-iteration-count, tutti i browser mainstream supportano questa proprietà.
|
Si prega di consultare la seguente guida：Animazione CSS3。
Proprietà e regole correlate：animation，animation-name，animation-duration，animation-timing-function，animation-delay，animation-direction，animation-fill-mode，animation-play-state，@keyframes。