Attributo Style animation
- Pagina precedente alignSelf
- Pagina successiva animationDelay
- Torna alla pagina precedente Oggetto Style HTML DOM
Definizione e uso
animation
L'attributo è una abbreviazione di sei attributi di animazione:
- animationName
- animationDuration
- animationTimingFunction
- animationDelay
- animationIterationCount
- animationDirection
Nota:Regola sempre Attributo animationDurationAltrimenti la durata dell'animazione è 0 e non verrà mai riprodotta.
Esempio
Modifica l'animazione dell'elemento <div> utilizzando l'attributo abbreviato:
document.getElementById("myDIV").style.animation = "mynewmove 4s 2";
Sintassi
Restituisce l'attributo animation:
object.style.animation
Imposta l'attributo animation:
object.style.animation = "name duration timingFunction delay iterationCount direction fillMode playState"
Valore dell'attributo
Valore | Descrizione |
---|---|
animationName | Stabilisce il nome dei frame chiave da associare al selettore. |
animationDuration | Stabilisce il numero di secondi o millisecondi necessari per completare l'animazione. |
animationTimingFunction | Stabilisce la curva di velocità dell'animazione. |
animationDelay | Stabilisce il ritardo prima dell'inizio dell'animazione. |
animationIterationCount | Stabilisce il numero di volte che l'animazione deve essere riprodotta. |
animationDirection | Stabilisce se l'animazione deve essere riprodotta in senso inverso in un ciclo alternato. |
animationFillMode | Stabilisce il valore applicato oltre il tempo di esecuzione dell'animazione. |
animationPlayState | Stabilisce se l'animazione è in esecuzione o in pausa. |
initial | Imposta questo attributo al suo valore predefinito. Vedi initial. |
inherit | Eredità di questo attributo dal suo elemento padre. Vedi inherit. |
Dettagli tecnici
Valore predefinito: | none 0 ease 0 1 normal none running |
---|---|
Valore di ritorno: | Stringa che rappresenta l'elemento Proprietà animation. |
Versione CSS: | CSS3 |
Supporto del browser
animation
è una funzionalità CSS3 (1999).
Tutti i browser supportano completamente:
Chrome | Edge | Firefox | Safari | Opera | IE |
---|---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera | IE |
Supporto | Supporto | Supporto | Supporto | Supporto | 11 |
Pagine correlate
Manuale di riferimento CSS:Proprietà animation
- Pagina precedente alignSelf
- Pagina successiva animationDelay
- Torna alla pagina precedente Oggetto Style HTML DOM