Style transitionProperty-eigenschap
- Previous page transition
- Next page transitionDuration
- Go up one level HTML DOM Style Object
Definitie en gebruik
transitionProperty
Eigenschap die de naam van de CSS-eigenschap regelt die het overgangseffect aangaat (het overgangseffect wordt geactiveerd wanneer de opgegeven CSS-eigenschap verandert).
Tip:Wanneer de gebruiker de muis over het element houdt, treedt meestal een overgangseffect op.
Opmerking:Stel altijd in transitionDuration-eigenschapAnders is de duur 0, en het overgangseffect is ongeldig.
Zie ook:
CSS-handboek:transition-property-eigenschap
Voorbeeld
Zet de muis over het div-element om de breedte en hoogte geleidelijk te veranderen:
document.getElementById("myDIV").style.transitionProperty = "width,height";
Syntax
Retourneren van de transitionProperty-eigenschap:
object.style.transitionProperty
Instellen van de transitionProperty-eigenschap:
object.style.transitionProperty = "none|all|property|initial|inherit"
Eigenschapswaarde
Waarde | Beschrijving |
---|---|
none | Geen eigenschap krijgt een overgangseffect. |
all | Standaardwaarde. Alle eigenschappen krijgen een overgangseffect. |
property | Lijst van CSS-eigenschapnamen die de overgangseffecten definiëren, gescheiden door komma's. |
initial | Stel deze eigenschap in op zijn standaardwaarde. Raadpleeg initial. |
inherit | Deze eigenschap erft van de ouderlijke element. inherit. |
Technische details
Standaardwaarde: | all |
---|---|
Retourwaarde: | String, die de transition-property-eigenschap. |
CSS-versie: | CSS3 |
Browserondersteuning
Tafelnummers vermelden de versie van de browser die de eigenschap volledig ondersteunt.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
26.0 | 10.0 | 16.0 | 6.1 | 12.1 |
- Previous page transition
- Next page transitionDuration
- Go up one level HTML DOM Style Object