Domanda

Ho questa funzione
codice:
<script type="text/javascript">
function ShowAndHide(id1,id2){
if(document.getElementById){
el1=document.getElementById(id1);
el2=document.getElementById(id2);
if(el1.style.display=="none"){
el1.style.display="block";
el2.style.display="none";
}
else{
el1.style.display="none";
el2.style.display="block";
}
} }
</script>
...che permette di mostrare o nascondere 1 div richiamato da 1 link...

...Ora...

Io sto usando questa funzione su un TAB MENU fatto solo di CSS per richiamare un sottomenu anch'esso fatto da 1 div + css

C'è 1 BUG che ho trovato in quello che sto facendo ovvero che...esempio:

- Clicco sulla prima voce
- mi si apre sotto il "sottomenu" tutto regolare...

- clicco sulla seconda voce
- il sottomenu della seconda voce mi si apre sotto il "sottomenu" della prima voce (che non si è chiuso) e così via per tutti gli altri sottomenu...


Come posso modificare la funzione così che...al click di una voce mi apre il DIV interessato e mi chiude tutti gli altri?

questo l'esempio di codice della pagina JS + div
codice:
<script type="text/javascript">
function ShowAndHide(id1,id2){
if(document.getElementById){
el1=document.getElementById(id1);
el2=document.getElementById(id2);
if(el1.style.display=="none"){
el1.style.display="block";
el2.style.display="none";
}
else{
el1.style.display="none";
el2.style.display="block";
}
} }
</script>


<div id="nav">
  <ul>[*]Home[*]home[*]Voce 2[/list]
</div>


<div id="sottomenu">
  <ul class="sottomenu">[*]sottomenu home[/list]
</div>


<div id="sottomenu">
  <ul class="sottomenu">[*]sottomenu voce2[/list]
</div>
[/code
Ho riportato l'esempio con solo 2 voci di primo livello ma in realtà io ho 6 voci di primo livello ..coseguenza 6 sottomenu...
Spero di essermi spiegato bene