transition css sur background qui ne fonctionne pas quand j'actualise sur le forum Programmation - 25-04-2019 13:07:45

Niveau 5

25 avril 2019 à 13:07:45

je comprends, j'ai fais exactement comme le mec du tuto et chez lui ça marche sauf moi

<!DOCTYPE html>
<html>
<head>
    <title>test</title>
    <meta charset="utf-8">
    <style>
        body{
            height:100vh;
            display: flex;
            background-color:rgb(87,189,130);
            transition: background 1s ease;
            -webkit-transition: background 1s ease;
            -moz-transition: background 1s ease;
            -o-transition: background 1s ease;
            -ms-transition: background 1s ease;
            position:relative;
        }
    </style>
</head>
    <body>

    </body>
</html>

boucif

Niveau 24

25 avril 2019 à 13:22:13

Il te faut peut être un élement déclencheur, t'as transition te sert à rien dans ton cas comme ton background change jamais
<!DOCTYPE html> <html> <head> <title>test</title> <meta charset="utf-8"> <style> body{ height:100vh; display: flex; background-color:rgb(87,189,130); transition: background 1s ease; -webkit-transition: background 1s ease; -moz-transition: background 1s ease; -o-transition: background 1s ease; -ms-transition: background 1s ease; position:relative; } body:hover { background-color:red; } </style> </head> <body > </body> </html>

boucif

Niveau 24

25 avril 2019 à 13:28:34

tu peux même modifier ton background en js
setTimeout(function (){
document.getElementsByTagName("body")[0].style.backgroundColor="red";
},1000);

jeanTisane

Niveau 7

25 avril 2019 à 15:01:07

Le 25 avril 2019 à 13:28:34 boucif a écrit :
tu peux même modifier ton background en js
setTimeout(function (){
document.getElementsByTagName("body")[0].style.backgroundColor="red";
},1000);

ouai je sais j'aurais pu aussi la jouer avec JS mais la j'essaye de comprendre un truc :
https://youtu.be/wc5k2AMPED0?t=434

comment ça ce fait qu'il arrive a obtenir ce resultat ?

le gars met juste background-color : quelquechose puis transition sur background et il arrive a obtenir une animation à chaque rafraîchissement de page pourquoi ?

Informatique

Programmation