problème Javascript et Css

Bonjour,

j'ai un petit problème en essayant de faire un menu à plusieurs niveaux.
En fait j'ai un menu déroulant vertical sous cette forme:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

<div id='menu' > <h1>Navigation</h1> <dl> <dt id='menu1' onclick="javascript:afficher();"><a href=''>Accueil</a></dt> <dt id='menu2' onclick="javascript:afficher('menu2');"><a href='#'>Photos</a></dt> <dd id='smenu2'> <ul> <li id='smenu21'><a href='#'>Intro</a></li> <li id='smenu22'><a href='#'>photos1</a></li> </ul> </dd> <dt id='menu3'onclick="javascript:afficher('menu3');"><a href='#'>Programmes</a></dt> <dd id='smenu3'> <ul> <li id='smenu31'><a href='#'>Intro</a></li> <li id='smenu32'><a href='#'>prog1</a></li> <li id='smenu33'><a href='#'>prog2</a></li> </ul> </dd> <dt id='menu4'><a href=''>Forum</a></dt> <dt id='menu5'><a href=''>Contact</a></dt> </dl> </div>

---

Ce menu utilise une feuille de style externe CSS et un code javascript pour afficher/masquer les sous-menus lorsque l'on clique sur le menu


Mon problème est que j'aimerais qu'au chargement du menu, un des menus soit déjà préselectionné en respectant la feuille de style

Code:

---

1 2 3 4 5 6

#menu li a:hover,#menu li a:focus { background-color: lavender; color: darkblue; border-color: #FFFFFF; }

---

J'avais pensé faire un

Code:

---

document.getElementById('menu2').focus();

---

mais cela ne marche pas.
...

Code:

---

1 2 3 4 5

#menu li a:hover,#menu li a:focus, .defaut { background-color: lavender; color: darkblue; border-color: #FFFFFF; }

---

Code:

---

document.getElementById('menu2').className='defaut';

---

Merci ca marche en partie.

J'ai bien ma couleur d'arrière plan qui est affichée.
Par contre la couleur du texte n'est pas changée.
Je pense que c'est parceque je n'ai pas de texte mais uniquement des liens <a>Lien</a> et ceux ci ne sont pas pris en compte dans cette méthode.

Du coup je en sais pas comment faire (je précise que je suis débutant en css, javascript ...)
j'ai essayé de mettre ".defaut a" au lieu de ".defaut" mais ca ne marche pas

est tu sur que "darkblue" est accepté par ton browser ? IE ou FFX ?

oui il accepte bien darkblue, mais en fait en l'occurence je m'étais planté je parlais plutôt de ce code css:

Code:

---

1 2 3 4 5

#menu dt a:hover,#menu dt a:focus,.menusel { background-color: #8D9299; color: #FFFFFF; border-color: #FFFFFF; }

---

et j'ai mis ce code là dans le javascript

Code:

---

document.getElementById('menu2').className='menusel';

---

et donc l'arrière plan est bien changé, mais la couleur du texte non

par contre si je mets

Code:

---

<dt id='menu2' onclick="javascript:afficher('menu2');">Texte1<a href='#'>Texte2</a></dt>

---

là il va afficher Texte1 en blanc et Texte2 en noir



je mets le lien vers ma page web avec le menu

mon menu