20-09-2010, 11:05 AM
(Modification du message : 20-09-2010, 11:08 AM par NicoMSEvent.)
Pour info, mon menu pour mon jeu est composé de petites icones, et j'utilise ça de cette manière (en espérant qu'il est suffisament accessible-> je n'ai pas mis de alt dans les tags "a", mais j'ai un texte masqué grace au CSS dans une balise "span"):
Si il y a de meilleures manières de faire, je suis partant (a part le fait d'utiliser un seul sprite pour toutes mes icones, ce que je compte faire a moyen-court terme ^^)
Edit : j'ai vu après coup que je n'utilise pas de :hover ... donc, je suis p-e à coté du sujet ici... bien que c'est hyper simple a ajouter (je suppose) a partir de ce qui est déjà présenté ici
<div class="toolbar" id="menu_sys">
<span class="hidden"><a name="menu_sys">Menu système</a></span>
<ul class="toolbar" id="menu_jeu_ico">
<li id="msg" title="Chuchoteur">
<a href="?action=msg" accesskey="m"><span class="hidden">Chuchoteur (messagerie)</span></a></li>
<li id="inv" title="Inventaire"><a href="?action=inv" accesskey="i"><span class="hidden">Inventaire</span></a></li>
<li id="quest" title="Journal des quêtes"><a href="?action=quest"><span class="hidden">Journal des quêtes</span></a></li>
<li id="options" title="Options"><a href="?action=options" accesskey="o"><span class="hidden">Options</span></a></li>
<li id="quit" title="Déconnecter"><a href="?action=quit" accesskey="x"><span class="hidden">Déconnecter</span></a></li>
<li id="aide_dv" title="Raccourcis DV" class="hidden"><a href="?action=aide_dv" accesskey="6"><span class="hidden">Raccourcis DV</span></a></li>
</ul>
</div>
et le CSS qui va avec :
.hidden{
display:none;
}
.toolbar a{
display:block;
height:100%;
}
.toolbar>li{
float:left; /*aligne sur une ligne horizontale mes icones*/
display:inline;
margin:2px;
}
#menu_jeu_ico{
height:35px;
position:relative;
}
#menu_jeu_ico>li{
width:35px;
height:35px;
}
#msg{background:url("./images/ico/msg0.gif");}
#msg_{background:url("./images/ico/msg1.gif");}
#inv{background:url("./images/ico/inv.JPG");}
#quest{background:url("./images/ico/icone007.JPG");}
#options{background:url("./images/ico/icone009.JPG");}
#quit{background:url("./images/ico/icone010.JPG");}
Si il y a de meilleures manières de faire, je suis partant (a part le fait d'utiliser un seul sprite pour toutes mes icones, ce que je compte faire a moyen-court terme ^^)
Edit : j'ai vu après coup que je n'utilise pas de :hover ... donc, je suis p-e à coté du sujet ici... bien que c'est hyper simple a ajouter (je suppose) a partir de ce qui est déjà présenté ici
Je signale que je ne détiens pas la vérité unique et absolue, je peux me tromper. La critique peut aussi être constructive. Critiquez moi!
La quête d'Ewilan
http://easy2hack.ma-soiree.be
La quête d'Ewilan
http://easy2hack.ma-soiree.be