Style animation-egenskaben
- Forrige side alignSelf
- Næste side animationDelay
- Gå tilbage til forrige niveau HTML DOM Style Object
Definition og brug
animation
Egenskaben er en forkortelse af seks animationsegenskaber:
- animationName
- animationDuration
- animationTimingFunction
- animationDelay
- animationIterationCount
- animationDirection
Bemærkninger:Bestem altid animationDuration-egenskabenEllers varer varigheden 0, og den spiller aldrig af.
Eksempel
Brug af forkortelsesegenskaber til at ændre animationen af <div>-elementet:
document.getElementById("myDIV").style.animation = "mynewmove 4s 2";
Syntaks
Returner animation egenskab:
object.style.animation
Indstil animation egenskab:
object.style.animation = "name duration timingFunction delay iterationCount direction fillMode playState"
Egenskabsværdi
Værdi | Beskrivelse |
---|---|
animationName | Regulerer navnet på de nøgle rammer, der skal bindes til vælgeren. |
animationDuration | Regulerer hvor mange sekunder eller millisekunder animationen skal tage at fuldføre. |
animationTimingFunction | Regulerer animationens hastighedskurve. |
animationDelay | Regulerer forsinkelsen før animationen starter. |
animationIterationCount | Regulerer, hvor mange gange animationen skal afspilles. |
animationDirection | Regulerer, om animationen skal afspilles i omvendt rækkefølge i en alternativ cyklus. |
animationFillMode | Regulerer værdien, der anvendes uden for animationens køretid. |
animationPlayState | Regulerer, om animationen er kørende eller pauset. |
initial | Sæt denne egenskab til dens standardværdi. Se initial. |
inherit | Arv denne egenskab fra sin forældreelement. Se inherit. |
Tekniske detaljer
Standardværdi: | none 0 ease 0 1 normal none running |
---|---|
Returværdi: | Streng, der repræsenterer elementets animation egenskab. |
CSS version: | CSS3 |
Browser understøttelse
animation
er en CSS3 (1999) egenskab.
Det understøttes fuldt ud af alle browsere:
Chrome | Edge | Firefox | Safari | Opera | IE |
---|---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera | IE |
Support | Support | Support | Support | Support | 11 |
Relaterede sider
CSS referenceranimation egenskab
- Forrige side alignSelf
- Næste side animationDelay
- Gå tilbage til forrige niveau HTML DOM Style Object