Vedi un po' questo
Ho lasciato i commenti, così qualcuno potrà correggermi il codice e renderlo più performante... funzica su IE, FF, e Opera8. Non ho provato con altri browsers. Ciao!codice:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style>/* #slidemenu ul li ul { display: none; }*/ </style> <title>Menu</title> <script language="javascript" type="text/javascript"> function init(targetmenu) { menu_ul = document.getElementById(targetmenu).getElementsByTagName("ul"); //alert(menu_ul.length); for (var i=0; i < menu_ul.length; i++) { menu_ul[i].style.display = (menu_ul[i].parentNode.id == targetmenu ? "block" : "none"); } } function check_and_show(source, targetmenu) { disp = source.parentNode.getElementsByTagName("ul"); //alert(disp.length); temp = disp[0]; allAffectedNodes = new Array(); //prende i nodi nel ramo clickato. while (temp.parentNode.id!=targetmenu) { if (temp.tagName.toLowerCase() == "ul") { //alert("true"); i = allAffectedNodes.push(temp); } temp = temp.parentNode; } //aggiunta di oggi lastDisplayStatus = allAffectedNodes[0].style.display; //prendo lo stato del ramo clickato init(targetmenu); //chiudo tutto il menu if (lastDisplayStatus=="block") { //la voce era visibile, voglio chiudere tutto il menu nel ramo sottostante. for (var i = allAffectedNodes.length-1; i > 0; i--) { //riapro tutti i nodi fino a quello clickato allAffectedNodes[i].style.display = "block"; } //chiudo il nodo clickato e tutti i sottonodi allAffectedNodes[0].style.display = "none"; submenu_ul = allAffectedNodes[0].getElementsByTagName("ul"); for (var i = 0; i < submenu_ul.length; i++) { submenu_ul[i].style.display = "none"; } } else { // il nodo era chiuso e lo voglio aprire for (var i=allAffectedNodes.length-1; i >=0; i--) { allAffectedNodes[i].style.display = "block"; } } } </script> </head> <body onload="init('slidemenu');"> <div id="slidemenu"> <ul>[*]First Level - I [*]First Level - II <ul> [*]Second Level - I [*]Second Level - II [*]Second Level - III [/list] [*]First Level - III <ul> [*]Second Level - IV [*]Second Level - V <ul> [*]Third Level - I [*]Third Level - II [*]Third Level - III [/list] [*]Second Level - VI [/list] [*]First Level - IV[/list] </div> </body> </html>