Tre saluti a tutti gli operatore e utenti, anche questa volta ho deciso di pubblicare sul forum di HTML.it una mia pillola...Cmq non sapevo che titolo inserire nel campo...Vediamo....questa volta ho anche commentato il mio lavoro...
Ecco il codice:
Ok?Ciao, ciao!codice:<html> <head> <title>Menu sottovoci</title> <style type="text/css"> /* personalizziamo i link, puoi anche aumentare la grandezza delle voci e diminuire quella delle sottovoci */ a:link, a:active, a:visited {font:normal 1pc arial; color:blue; text-decoration:underline} a:hover {color:red; text-decoration:underline overline} </style> <script language="javascript"> <!-- // precarichiamo le immagine che simuleranno cartella aperta/chiusa var image=new Array() for(var x=0; x<2; x++) { image[x]=new Image(); image[x].src=("arrow"+x+".gif"); //arrow1.gif=aperta, arrow0.gif=chiusa }; function controllaBrowser() { if(document.layers) { //se è netscape4.x il browser usa la sua sintassi per scrivere la tabella che contiene il menu nel divisore return document.layers["contMenu"].document.write(controllaBrowser.arguments[0]); } else if(document.all) { //idem per quanto riguarda MSIE 4.x o superiore... return document.all["contMenu"].innerHTML=controllaBrowser.arguments[0]; } else if(document.getElementById) { // idem per quanto riguarda i nuovi navigatori return document.getElementById("contMenu").innerHTML=controllaBrowser.arguments[0]; } else { // se non si puo fare niente ritorna 0 return 0; }; }; function creaMen(quale) { var voci=new Array("Articoli","Chat","Contatta","Forum","Svago"); var subVoces=new Array(); subVoces[0]=["Togliere alla scuola...","\"Carissima\" scuola...","Contro il \"caro\" scu..."]; /* questo è un letterale stringa, potevamo scrivere anche new Array(elemento1, elemento2); */ subVoces[1]=["...studenti","...operatori"]; subVoces[2]=["...un operatore","...tutti"]; subVoces[3]=["Forum studenti","Forum prof."]; subVoces[4]=["x Donne","x Uomini"]; /* dopo con un for scriveremo tutte le sottovoci delle voci del menu...(per dovere di chiarezza) per accedere alle sottovoci: subVoces[0][0] che è uguale a Togliere alla scuola... */ var linka=new Array(); linka[0]=["artuno.htm","artdue.htm","arttre.htm"]; linka[1]=["chat1.htm","chat2.htm"]; linka[2]=["scelta.htm","mailto:brunelleskosi@tiscali.it"]; linka[3]=["forum.htm","forum2.htm"]; linka[4]=["unica.htm?s=d","unica.htm?s=u"]; /* questi sono i link delle sottovoci...per "collegare" il link alla sottovoce usiamo il metodo link. Esempio: subVoces[0][0].link(link[0][0]); */ //Ora passiamo all costruzione del menu, ricorda che tra poco scriveremo una funzione che permette a tutti i browser di eseguire questo script */ var table="<table width=\"250\" border=\"0\">"; for(var x=0; x<voci.length; x++) { //chiamata la funzione con un for vediamo quale è la scelta dell'utente e apriamo quella determinata voce... if(x==quale) {//quale è l'argomento passato alla funzione //se x è uguale alla voce richiesta allora agginge alla variabile table la sottovoce della voce table+="<tr><td><img src=\""+image[1].src+"\" alt=\"Cartella Aperta\"><a href=\"javascript:creaMen(-1);\">"+voci[x]+"</a></td></tr>"; //nel link ho inserito l'argomento -1 cosi una volta aperta potrà anche essere chiusa */ table+="<tr><td><ul type=\"square\">"; for(var y=0; y<subVoces[x].length; y++) table+=("[*]"+subVoces[x][y].link(linka[x][y])+""); table+="[/list]</td></tr>"; } else {//altrimenti continua ad aggiungere le voci table+=("<tr><td><img src=\""+image[0].src+"\" alt=\"Cartella chiusa\"><a href=\"javascript:creaMen("+x+");\">"+voci[x]+"</a></td></tr>"); }; }; table+="</table>"; //il tutto viene passato alla funzione che controlla quale browser sta eseguendo lo script controllaBrowser(table); if(document.layers) document.layers["contMenu"].document.close(); }; //--> </script> </head> <body onload="creaMen(-1);"> <div id="contMenu" style="position:absolute; top:20px; left:50px"></div> </body> </html>
aggiorna la discussione precedente.
