Menu ne change pa o survol de la souris sr IE
dragazor
Messages postés
56
Statut
Membre
-
dragazor Messages postés 56 Statut Membre -
dragazor Messages postés 56 Statut Membre -
Bonjour à tous,
j'ai un soucis sur mon site, quand j'ai créé un menu qui fonctionne très bien sur Firefox mais pas sous IE, quand je passe la souris sur Firefox, le bouton du menu change de couleur et la souris change pour montrer que c'est un lien mais sous IE la couleur ne change pas (enfin l'image ne change pas) et le bouton n'est pas reconnu comme lien.
J'espère que vous pourrez éclairer mes lanternes.
je vous mets le code:
et le css:
Je vous remercie d'avance.
j'ai un soucis sur mon site, quand j'ai créé un menu qui fonctionne très bien sur Firefox mais pas sous IE, quand je passe la souris sur Firefox, le bouton du menu change de couleur et la souris change pour montrer que c'est un lien mais sous IE la couleur ne change pas (enfin l'image ne change pas) et le bouton n'est pas reconnu comme lien.
J'espère que vous pourrez éclairer mes lanternes.
je vous mets le code:
<div id="menu" style="width:1024px;">
<ul style="margin:0; padding:0;">
<li>
<a id="accueil" href="?page=accueil"></a>
</li>
<li>
<a id="recup" href="?page=recup"></a>
</li>
<li>
<a id="session" href="?page=session"></a>
</li>
<li>
<a id="formation" href="?page=formation"></a>
</li>
<li>
<a id="contact" href="?page=contact"></a>
</li>
<li>
<a id="lien" href="?page=lien"></a>
</li>
</ul>
</div>
<div id="translation" align="center">
<img src="menu/translation.png" />
</div>
<div id="page" align="center" style="background-color:#FFF; width:1024px;">
<?php
if (isset($_GET['page'])){
$page=$_GET['page'];
}
else {
$page='accueil';
}
switch ($page){
case "accueil":
include("accueil/accueil.php");
break;
case "recup":
include("recup/recup.php");
break;
case "session":
include("session/session.php");
break;
case "formation":
include("formation/formation.php");
break;
case "contact":
include("contact/contact.php");
break;
case "lien":
include("lien/lien.php");
break;
default:
include("accueil/accueil.php");
break;
}
?>
</div>
et le css:
#menu a{
border:none;
margin:0;
padding:0;
display:block;
}
#menu img{
border:none;
margin:0;
padding:0;
}
#menu li{
margin:0;
padding:0;
list-style:none;
float:left;
}
a#accueil{
background-image:url(menu/accueil.png);
height:50px;
width:170px;
}
a#accueil:hover{
background-image:url(menu/accueil_hover.png);
height:50px;
width:170px;
}
a#recup{
background-image:url(menu/recup.png);
height:50px;
width:170px;
}
a#recup:hover{
background-image:url(menu/recup_hover.png);
height:50px;
width:170px;
}
a#session{
background-image:url(menu/session.png);
height:50px;
width:170px;
}
a#session:hover{
background-image:url(menu/session_hover.png);
height:50px;
width:170px;
}
a#formation{
background-image:url(menu/formation.png);
height:50px;
width:170px;
}
a#formation:hover{
background-image:url(menu/formation_hover.png);
height:50px;
width:170px;
}
a#contact{
background-image:url(menu/contact.png);
height:50px;
width:170px;
}
a#contact:hover{
background-image:url(menu/contact_hover.png);
height:50px;
width:170px;
}
a#lien{
background-image:url(menu/lien.png);
height:50px;
width:174px;
}
a#lien:hover{
background-image:url(menu/lien_hover.png);
height:50px;
width:174px;
}
Je vous remercie d'avance.
Configuration: Windows 7 Firefox 3.5.4
2 réponses
-
Si je peux te donner un conseil... utilise des classes pour identifier tes liens, pas des id.
Ensuite, travail plutôt avec 1seule image contenant les 2 états de ton lien et "déplace" le background avec ton css (et en plus ça évite le clignotement dû au chargement de l'autre image).
Ex.:#menu a { display:block; border:0; margin:0; padding:0; background-position:top left; } #menu a:hover { background-position:bottom left; } #menu a.accueil { width:170px; height:50px; background-image:url(menu/accueil.png); }
Si tu ne vois toujours pas de changement c'est peut-être dû au "chemin", alors essaye en précisant bien la filiation : #menu ul li a {} -
Je te remercie pour ta réponse, je n'avais jamais testé comme ca, je vais le faire, pas maintenant jsuis un peu trop fatigué. Mais en tout cas merci, dautant plus que ta solution permettrait de résoudre le problème de clignotement que j'ai en effet sous firefox.