Discussion :

[Suwabara]

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 :

S�lectionner tout - Visualiser dans une fen�tre � part

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 :

S�lectionner tout - Visualiser dans une fen�tre � part

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 :

S�lectionner tout - Visualiser dans une fen�tre � part

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

mais cela ne marche pas.
...

[SpaceFrog]

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

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

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

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

[Suwabara]

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

[SpaceFrog]

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

[Suwabara]

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

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

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 :

S�lectionner tout - Visualiser dans une fen�tre � part

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 :

S�lectionner tout - Visualiser dans une fen�tre � part

<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