propriété Style transition

définition et utilisation

transition cette propriété est une abréviation des quatre propriétés de transition :

notes :précisez toujours propriété transitionDurationsinon la durée est de 0, la transition est invalide.

voir aussi :

Manuel de référence CSS :propriété transition

exemple

placez le curseur sur l'élément div pour changer progressivement son apparence :

document.getElementById("myDIV").style.transition = "all 2s";

essayez-le vous-même

syntaxe

retourner la propriété transition :

object.style.transition

Définir la propriété transition :

object.style.transition = "property duration timing-function delay|initial|inherit"

valeur de l'attribut

valeur description
transitionProperty définir le nom de la propriété CSS visée par l'effet de transition.
transitionDuration définir le temps nécessaire en secondes ou en millisecondes pour que l'effet de transition soit terminé.
transitionTimingFunction définir la courbe de vitesse de l'effet de transition.
transitionDelay définir quand l'effet de transition commence.
initial remettre cette propriété à sa valeur par défaut. Voir aussi initial.
inherit hérite de cette propriété de son élément parent. Voir aussi inherit.

détails techniques

valeur par défaut : all 0 ease 0
valeur de retour : chaîne, indiquant l'élément propriété transition.
Version de CSS : CSS3

Support du navigateur

Les numéros dans le tableau indiquent la version du navigateur qui prend en charge cette propriété pour la première fois.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
26.0 10.0 16.0 6.1 12.1