Boucler une transition ?
Résolu
Utilisateur anonyme
-
Utilisateur anonyme -
Utilisateur anonyme -
Bonjour,
Je cherche à changer la couleur d'un background, pour ensuite revenir à la couleur d'origine. J'ai un peu de mal à m'en sortir avec les transitions.
Si quelqu'un peut m'aider, voici mon Jsfiddle :
http://jsfiddle.net/rzxs357m/1/
Merci de m'aider à y voir plus clair.
Je cherche à changer la couleur d'un background, pour ensuite revenir à la couleur d'origine. J'ai un peu de mal à m'en sortir avec les transitions.
Si quelqu'un peut m'aider, voici mon Jsfiddle :
http://jsfiddle.net/rzxs357m/1/
Merci de m'aider à y voir plus clair.
1 réponse
-
salut,
si tu souhaite faire une sorte de highlight => https://api.jqueryui.com/highlight-effect/
tu peux éventuellement le faire avec une keyframe.
#test { border: 1px solid black; border-radius: 2px; padding: 5px; background: #FFF; -webkit-transition: background-color 100ms linear; -moz-transition: background-color 100ms linear; -o-transition: background-color 100ms linear; -ms-transition: background-color 100ms linear; transition: background-color 100ms linear; } #test:target { -webkit-animation: changeBg 1s; -moz-animation: changeBg 1s; animation: changeBg 1s; } @-webkit-keyframes changeBg { 0% {background: #AD310B;} 100% {background: #FFF;} } @-moz-keyframes changeBg { 0% {background: #AD310B;} 100% {background: #FFF;} } @keyframes changeBg { 0% {background: #AD310B; } 100% {background: #FFF;} }
bonne journée
׺°"~'"°º×]|I{*------» LÖBÖTÖ «------*}I|[׺°"~'"°º×-
-
Merci l'ami, la méthode du keyframe fonctionne au poil, j'ai simplement adapté ton exemple pour qu'il fasse gris → orange → gris.
Voici le Jsfiddle final pour ceux que ça intéresse :
http://jsfiddle.net/rzxs357m/3/ -
-