Buongiorno a tutti. (Sono ancora qui!!!
)
Sto costruendo un menu orizzontale utilizzando una table nel seguente modo:
codice:
<tr>
<td>
Menu1
</td>
...
<td>
MenuN
</td>
</tr>
<tr>
<td>
SottoMenu1
</td>
...
<td>
SottoMenuN
</td>
</tr>
In questo modo creo una table con due righe e N colonne dove ogni colonna è un menu con relativo sottomenu.
Ovviamente i <td> dei sottomenu sono settati con dispay:none.
mentre i td dei Menu sono compresi di evento onclick che lancia la seguente funzione javascript:
codice:
function apriMenu(menu)
{
browserName = navigator.appName;
if(browserName == "Netscape")
document.getElementById(menu).style.display = "table-cell";
else
document.getElementById(menu).style.display = "block";
}
Il tag display:table-cell funziona bene su netscape e ff mentre block funziona meglio sugli altri, ma in tutti e due i casi c'è il seguente problema:
se il primo menu ad essere cliccato è il Menu i-esimo esso viene aperto sotto il Menu1,
se il secondo fosse (i+1)-esimo esso si apre sotto il menu2; questo è dovuto al display:none che considera del tutto inesistente il contenuto del td e appena lo rendo visibile lo inserisce ad inizio tabella.
Come posso ovviare a questo?
Come posso completare la mia funzione apriMenu in modo che sia correttamente visualizzata?
Grazie a tutti per aiuti e consigli