Bonjour,

je suis en train de réaliser un site internet pour mon projet et je chercher à changer la photo lorsque l'on passe par dessus avec la souris, en regardant les tutos je suis arriver jusqu'à la:

<div >
 <a href="index.php?action=logout" id="sign_out"></a>
</div>

et pour le css:

#sign_out {
width: 32px;
height:32px;
display:block;
background: url("/public/img/sign_out.png");
}
#sign_out:hover {
width: 32px;
height: 32px;
display: block;
background: url("/public/img/sign_out_2.png");

Mais ceci à fait disparaître mon liens et rien n'apparaît; es-ce que quelqu'un aurait une solution???

Merci

Bonjour SébastienRipolles,

Ton code est bon, je l'ai testé. Ton pb vient soit de  :

• /public/img/sign_out_2.png n'existe pas
• /public/img/sign_out_2.png est longue à charger

Ta méthode n'est pas bonne tu va avoir le même Pb que lilsource  :

https://openclassrooms.com/forum/sujet/boutons-hover-qui-sautent-au-passage-de-la-souris

Je te ferais donc la meme remarque :

1) voir si ton bouton ne peut pas être fait en full Css

2) voir si ton effet hover, n'est pas faisable en css

3) mettre des sprites, c'est à dire avoir une seule image des tes états de boutons et décaler le background suivant tes états

Merci de ta réponse, au final j'ai utiliséJavaScript pour régler le problème avec 'onmouseover'