Style transition egenskab
- forrige side transformStyle
- næste side transitionProperty
- Tilbage til toppen HTML DOM Style Object
Definition og brug
transition
Egenskaben er en forkortelse for de fire overgangsegenskaber:
Kommentarer:Regel altid specificer transitionDuration egenskabEllers varer overgangen 0 sekunder, og overgangen vil være ugyldig.
Se også:
CSS reference manual:transition egenskab
Eksempel
Placer musen over div-elementet for at ændre dets udseende gradvist:
document.getElementById("myDIV").style.transition = "all 2s";
Syntaks
Retur transition egenskab:
object.style.transition
Indstil transition egenskab:
object.style.transition = "property duration timing-function delay|initial|inherit"
Egenskabsværdi
Værdi | Beskrivelse |
---|---|
transitionProperty | Angiver navnet på den CSS-egenskab, overgangen er rettet mod. |
transitionDuration | Angiver, hvor mange sekunder eller millisekunder overgangen skal tage at fuldføre. |
transitionTimingFunction | Angiver hastighedskurven for overgangen. |
transitionDelay | Definerer, når overgangen skal begynde. |
initial | Sæt denne egenskab til dens standardværdi. Se initial. |
inherit | Arve denne egenskab fra sin forældrelige element. Se inherit. |
Tekniske detaljer
Standardværdi: | all 0 ease 0 |
---|---|
Returværdi: | streng, der angiver elementets transition egenskab. |
CSS version: | CSS3 |
Browserunderstøttelse
Talene i tabellen angiver den første browserversion, der fuldt ud understøtter egenskaben.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
26.0 | 10.0 | 16.0 | 6.1 | 12.1 |
- forrige side transformStyle
- næste side transitionProperty
- Tilbage til toppen HTML DOM Style Object