Changer image au moment ou le souris est dessus !

27 mars 2006 à 11:46:51

Bonjour, j'ai rechercher tout d'abord mais je n'ai pas trouver !
Je croyais bien avoir vu ça dans les cours mais je ne trouve plus

Voilà mon problème qui est assez simple, j'ai une image lien, j'aimerais que lorsque le visiteur pointe la souris sur cette image, elle change d'aimage en fait

Voilà, j'espère m'avoir fait compris !
Merci et ++

StarMatt

27 mars 2006 à 11:57:00

a:hover
{
background-image: url('tonimage');
}

Linuks

27 mars 2006 à 12:10:39

Ca n'a pas l'air de marcher...
Quand je vais vers le lien, l'image change mais il reste l'ancienne :
http://big.nintendo.free.fr/liens/musiques/europe_2/europe_2.html
C'est l'image Europe 2 !

StarMatt

27 mars 2006 à 12:11:57

Montre ton code stp

shuss

27 mars 2006 à 12:23:45

hover, ça ne marche pas que pour un lien ?

Sinon il y a le JavaScript

Mais ça ne marchera pas pour ceux qui ont désactivé JavaScript.

Quoique, essaie ça

a
{
background-image: url('http://big.nintendo.free.fr/images/europe_2.gif');
}
a:hover
{
background-image: url('http://big.nintendo.free.fr/off.gif');

et enlève l'image dans ton lien.

Linuks

27 mars 2006 à 12:25:38

a:hover
{
background-image: url('http://big.nintendo.free.fr/off.gif');
text-decoration: underline;
}

Mes images :
Image utilisateur

Merci à toi

J'ai essayé vos solutions mais ça ne marche pas

Shuss, ça ne met pas l'image lol
Sinon, regardez le lien

StarMatt

27 mars 2006 à 12:53:34

Essay ca :

#europe2 a
{
height: 32px;
width: 55px;
background-image: url("http://big.nintendo.free.fr/images/europe_2_off.gif");
background-repeat: no-repeat;
}

#europe2 a:hover
{
height: 32px;
width: 55px;
background-image: url("http://big.nintendo.free.fr/images/europe_2_on.gif");
background-repeat: no-repeat;
text-decoration: underline;
}

Chuis pas sur que ca marche mais essay quand meme !

Linuks

27 mars 2006 à 13:11:14

Merci de m'aider, c'est vraiment sympa

J'essayerai ça surement aprés les cours et je te redirai

Voilà, merci à toi

StarMatt

27 mars 2006 à 13:16:46

Ok tient moi au courant

jp949

27 mars 2006 à 15:37:45

#eu2 a {
background: url(media.jpg) no-repeat center center;
height: XYpx;
width: XYpx;

}
#eu2 span { display:none;}
#eu2 a:hover {
background: url(media_hover.jpg) no-repeat center center;
height: XYpx;
width: XYpx;

}

Linuks

28 mars 2006 à 10:07:40

Merci à vous deux, ça marche bien