Jiff a écrit a écrit :
Code :
- <div id="Menu 1-2" style="position:absolute; left:0px; top:81px; width:162px; height:13px; z-index:2" class="menu-1-off" onMouseOver="class="menu-1-on";"></div>
|
|
Argh ! quelle horreur !
Bon reprenons, il y a 2 manières de faire des rollovers sur un <div> :
* Soit avec JavaScript
Dans ce cas tu dois donner un nom correct à ton <div> avec l'attribut "id". Déjà, tu n'as pas droit aux espaces dans "id", donc ton id="Menu 1-2" est faux. Je rappelle également qu'un "id" doit être unique pour tout le document.
Ensuite ton onmouseover est faux. Tu ne peux pas écrire onMouseOver="class="menu-1-on"; car le navigateur va s'arrêter dès le 2ème guillemet et ne va garder que "class=" ce qui est faux. De toute façon ce n'est pas comme ça qu'on change la couleur du fond.
Tu dois écire ton onmouseover comme ça :
onmouseover="this.style.backgroundColor='#990000';" |
"this" sert à désigner l'objet courant (le <div> ).
Ensuite il suffit de faire pareil avec un onmouseout pour remettre la bonne couleur lorsque la souris quitte le <div>
* Soit avec les CSS
J'imagine que ton menu contient des liens. On peut donc imaginer qu'ils s'organisent comme ça :
<div id="menu">
<a href="...">Lien 1</a>
<a href="...">Lien 2</a>
<a href="...">Lien 3</a>
</div> |
Déjà, on peut se dispenser de mettre chaque lien dans un <div> grâce à la propriété CSS display: block;
div#menu a {
display: block;
} |
Ceci dit que tout élément <a> se trouvant dans un <div> qui a l'id "menu", l'élément <a> se comporte comme une boîte (c'est à dire comme un <div>, les <a> s'empilent verticalement les uns sur les autres)
Ensuite il suffit de définir une couleur de fond pour l'élément <a> ainsi qu'une couleur pour le cas où la souris se trouve en dessus de celui-ci. Ce qui au final nous donne :
div#menu a {
display: block;
background-color: #FF0000;
}
div#menu a:hover {
background-color: #990000;
} |
A toi donc de choisir la méthode qui te convient (la seconde est à préférer car tout le monde n'active pas le JavaScript)
Message édité par gm_superstar le 24-10-2002 à 20:39:45
---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog