Fonction 'hover' sous IE et Firefox...

IE n'accepterait-il que les lien ?

Sujet résolu

10 décembre 2005 à 19:59:09

Bonjour à tous,
J'ai fait un site que j'ai testé sous Firefox et IE, et je constate une différence incroyable :

Mes div#nomdemonid:hover ne sont reconnus que par firefox, et les div#nomdemonid a:hover ne sont reconnus que par IE.

Du coup, je suis sacrément dans la mélasse, parce que c'est un background en image qui doit changer au passage de la souris (le background d'un lien), j'ai le sentiment d'être coincé, et de devoir choisir qui pourra voir mon site, les firefoxiens, ou les internetexploreriens

Quelqu'un pourrait-il me dire si je suis condamné, ou si il existe un remède fantastique qui pourra m'aider ?
Merci

jawadnet

10 décembre 2005 à 20:00:54

Bounjour
Peux tu nous faire voir Ton site ou ton code pour pouvoir t'aider?

Miccagrassu

10 décembre 2005 à 20:10:07

Oué je vais mettre ça dès que mon réseau remarche (je ne travaille pas sur cet ordinateur)

JulFisher

10 décembre 2005 à 20:12:28

Montre-nous déjà la partie de ton code XHTML et CSS concerné.

Nyro Xeo

10 décembre 2005 à 20:14:27

IE n'interprète la propriété :hover que sur le liens. Par contre, Firefox, lui, comprend tout, normalement (sur les liens et n'importe quel élément).

Si tu veux que le background de ton lien se change lorsque la souris passe au-dessus, c'est un lien donc cela devrait être compris par les deux navigateurs :

a.leLienImage
{
display: block; /* Pour pouvoir définir des dimensions à l'image */
background-image: url(image.png); /* L'image */
height: 30px; /* Hauteur de l'image */
width: 60px; /* Largeur de l'image */
}
a.leLienImage:hover
{
background-image: url(imageHover.png); /* Image lorsque la souris passe au dessus du lien */
}

Miccagrassu

10 décembre 2005 à 20:43:43

Je n'ai pas compris à quoi correspond le a.leLienImage, Nyro Xeo.

Par contre firefox ne comprend pas le div#nomdemonid a {blabla css}
ni le div#nomdemonid a:hover{blabla css}

Bizarre ...

(J'ai mis une image vide car mon image de fond est dans le CSS, donc on a l'impression de cliquer l'image de fond, alors que non

)

div#rubrique1 a{
background:url(images/rubrique1.gif);
width:145px;
height:57px;
}

div#rubrique1 a:hover{
background:url(images/hover-rubrique1.gif);
width:145px;
height:57px;
}

Le code ci dessus ne marche que sous IE

Et celui ci dessous ne marche que sous FF

rubrique1 {
background:url(images/rubrique1.gif);
width:145px;
height:57px;
}

div#rubrique1:hover{
background:url(images/hover-rubrique1.gif);
width:145px;
height:57px;
}

Nyro Xeo

10 décembre 2005 à 20:52:30

Le .leLienImage est une classe que tu appliques à un lien précis. Parce que si tu ne le fais pas, cela appliquera les propriétés à tous les liens.

Miccagrassu

11 décembre 2005 à 12:00:50

Ok ça marche impeccable, merci Nyro Xeo.

Si vous avez un jour le même problème, surtout n'oubliez pas le display:block; !