Bonjour,
Voilà mon problème :
J’ai créé un menu (en ligne), l’image est censée se remplacer par une autre lorsque la souris passe dessus (survol).
Avec ie 6 : pas de problème ça s’affiche correctement, mais sous firefox : rien n’apparait à l’écran.
Quelqu’un peut-il m’aider ?
Merci d’avance
Un extrait de mon script css :
.news{
display: inline;
height: 55px;
background: transparent url(main_menus_news_txt2.jpg) no-repeat;
}
.news a {
width: 104px;
height: 100%;
background: url(main_menus_news_txt1.jpg) no-repeat;
}
.news a:hover { /* masquage de lien.jpg au survol */
background: transparent none;
}
.clubs {
display: inline;
height: 55px;
background: transparent url(main_menus_clubs_txt2.jpg) no-repeat;
}
.clubs a {
width: 94px;
height: 100%;
background: url(main_menus_clubs_txt1.jpg) no-repeat;
}
.clubs a:hover { /* masquage de lien.jpg au survol */
background: transparent none;
}
Edité le 17/03/2008 à 16:31
Bon ben, finalement, j’ai trouvé un moyen d’y arriver !
J’ai changé mon script par ça :
Pour être honnête, je préférais l’autre méthode, mais celle-ci à l’avantage de fonctionner …
<style>
/* Menu 2 */
ul#menu2 {
margin:0;
padding:0;
list-style-type:none;
position: relative;
}
ul#menu2 li {
margin:0 0 0px 0;
padding:0;
position: absolute;
top: 0;
}
#itemA {
left:0;
width:104px;
}
#itemB {
left:114px;
width:94px;
}
ul#menu2 li a {
display:block;
width:114px;
height:55px;
}
#itemA a {
background:url('main_menus_news_txt1.jpg') no-repeat 0 0;
}
#itemA a:hover {
background:url('main_menus_news_txt2.jpg') no-repeat 0 0;
}
#itemB a {
background:url('main_menus_clubs_txt1.jpg') no-repeat 0px 0;
}
#itemB a:hover {
background:url('main_menus_clubs_txt2.jpg') no-repeat 0 0;
}
</style>
</head>
<body>
<ul id="menu2">
<li id="itemA"><a href="#"></a></li>
<li id="itemB"><a href="#"></a></li>
</ul>
Edité le 17/03/2008 à 16:31
Petite correction !
Avec des images de taille différentes, il faut remplacer :
ul#menu2 li a {
display:block;
width:114px;
height:55px;
}
Par :
ul#menu2 li a {
display:block;
width:100%;
height:55px;
}
Voilou