Résolu Transition header

Bonjour, j’ai essayé ce code sur un blog (lien) :

#header {    background-image:url("http://ekladata.com/B9gpxFKligaqBOD9S-RDtzhb460.jpg");
    background-position: center top;
background-repeat: no-repeat;
background-attachment: absolute;
-webkit-transition-duration: 2s;
-moz-transition-duration: 2s;
transition-duration: 2s;}

#header:hover { background: url("http://ekladata.com/YJ2iMTPFqWUKAMcGn7ttFU-bHUk.jpg");
        background-position: center top;
background-repeat: no-repeat;
background-attachment: absolute;
                   -webkit-transition-duration: 2s;
                   -moz-transition-duration: 2s;
                   transition-duration: 2s;}​

Mais j’ai un problème : Parfois il y a un fondu et parfois il n’y en a pas !

Est-ce que quelqu’un saurait comment régler ça, s’il vous plaît ? Merci d’avance !

Je ne vois pas de problème sur ton blog.

Tu utilises quel navigateur ?

J'utilisais Safari quand j'ai écrit ce message, et maintenant sur Firefox il n'y a plus de transition du tout...

Pour régler une partie du problème sous safari, met les propriété de transition dans #header au lieu de #header:hover

La propriété "transition" n'est pas encore bien implanté sur tous les navigateur, je pense que faire une transition entre deux images ne fonctionne pas encore sur Firefox.

Tu peux essayer de contourner le problème en plaçant une div de la même taille que ton header par dessus celui-ci avec ta première image. Au survol, tu passes l'opacité de cette div à 0 pour que le header soit visible avec ta deuxième image.