var voci=new Array();
	voci[0]=new Array("<img src='javascript.gif'>","<img src='staffscripts.gif'>","<img src='userscripts.gif'>","<img src='flyscripts.gif'>","P.O.J.'>","Newsgroup icly");
	voci[1]=new Array("Documenti","F.A.Q & Answers","Tutorials","Risorse e Downloads","Biblioteca","Links");
	voci[2]=new Array("About us","Staff","Collaboratori","Contatti","Credits");
	voci[3]=new Array("Varie","Servizi Gratuiti","Sondaggi","Hanno detto di noi","Banner","Advertising","Questo menu...");

      var nn=document.layers?true:false,conta=0,last=0;
      MenuLength=50+largo*voci.length;
      BrowserWidth=document.all?document.body.clientWidth:window.innerWidth;
      leftmargin=parseInt((BrowserWidth-MenuLength)/2);
      
      if (nn)

      Questo script è stata per me un'autentica sorpresa! Il giorno stesso che l'ho pubblicato nel sito a sostituzione del vecchio menu classico ho ricevuto varie richieste di riutilizzo.
      La cosa mi fa molto piacere ovviamente, e dunque in questo e nel prossimo StaffScript lo metto a vostra disposizione sia in versione "orizzontale" come l'ho usato io che verticale.
      Ci sono due caratteristiche originali in questo menu:

      - il fatto che quando un link viene cliccato il livello lampeggia;
      - ed il fatto che quando il mouse lascia la colonna dei sottomenu, dopo un secondo tutta la colonna viene colorata del colore "attivo" prima di essere nascosta.
      La prima caratteristica l'ho copiata dai menu di sistema dei Macintosh! Mi sembra che anche Win2K abbia adottato questo artificio grafico... spero che nessuno ci abbia messo il Copyright, comunque a me piace! :-)

      Lo script è un po' complicato da commentare linea per linea, quindi mi limiterò a dirvi come personalizzarlo, e poi a descrivere le funzioni principali senza approfondirle troppo.
      La prima parte delle personalizzazioni riguarda ovviamente i colori e la posizione.
      Nello script (comunque ben commentato) troverete per prime queste cinque variabili:

   var ron="#c00000"; Colore al MouseOver (Rosso in JsDir)
   var roff="#000000"; Colore di default (Nero in JsDir)
   var leftmargin=170; Distanza dal margine sinistro della pagina
   var topmargin=70; Distanza dal margine superiore della pagina
   var largo=125; Larghezza dei layers, quindi distanza (orizzontale) fra i sottomenu

      Seguono tre array (a loro volta costituiti da array) che rappresentano tutti i dati del menu.
      Il primo (voci()) contiene i testi visualizzati dai bottoni, nel caso di JsDir sono ad esempio: JavaScript (sottomenu del menu principale) che contiene "StaffScripts, UserScripts, FlyScripts, ecc. che sono le voci del sottomenu.
      È importante notare subito una cosa che riguarda la struttura degli array, da questa dipende la struttra del menu. Ogni array ("voci()", "links()" e "wst()") ha lo stesso numero di elementi, che a loro volta sono altri array costituiti per ogni array principale dallo stesso numero di elementi. Nel nostro menu, l'array "voci" ha 4 elementi (voci[0], voci[1], voci[2], voci[3]) che a loro volta sono array costituiti da:

   voci[0] --> 6 elementi
   voci[0] --> 7 elementi
   voci[0] --> 5 elementi
   voci[0] --> 7 elementi

      Gli altri due array principali ("links()" e "wst()") hanno la stessa identica struttura e contengono, rispettivamente, i links HTML ed il testo visualizzato nella barra di stato quando il mouse è sulla voce del menu. Questi tre array, in pratica, servono a ricostruire i classici link: <A HREF="pagina.html" onMouseOver="window.status='pagina'>Pagina</A>
      Il link Home è inserito di default come primo elemento del menu principale, se non lo volete è necessario elminare (o commentare) nello script il document.write() che lo scrive nel documento, che è il primo delle due sezioni per NN ed IE e scrive il layer (o DIV) "mtop" come vedremo subito.
      Invece il primo elemento degli array non è un link vero e proprio, ma rappresenta allo stesso tempo, sia le voci del menu principali, che il "titolo" dei sottomenu. Non essendo un link non gli ho collegato la funzione che attiva il link, quindi nell'array "links()" gli elementi, pur dovendo essere presenti sono delle stringhe vuote. Fate attenzione a questo particolare, perché se omettete questi elementi vuoti degli array otterrete che la prima voce del sottomenu aprirà il link della seconda, e così via, fino all'ultima che... non aprirà niente, perché non troverà un elemento nell'array!!!
      Questo è quanto. L'ultima cosa da dire prima di commentare lo script è che per lo stile dei testi ho usato dei CSS (nello script vedrete degli attributi CLASS) che troverete all'interno nel file .js nello ZIP da scaricare, e che dovrete riportare nel documento, eventualmente modificandoli a vostro gusto.

      Qualche parola sullo script.
      Dopo le variabili e gli array troverete il ciclo che scrive i livelli per NN (LAYER) e per IE (DIV). Non ho supportato Netscape 6 perché personalmente ho preferito disinstallarlo dal mio PC. Prima o poi uscirà una versione "decente" del programma che avrà il diritto di chiamarsi "browser", io comunque non l'ho provato e non l'ho inserito nella tabella del BrowserCheck che trovate in fondo alla scheda! :-)
      Ultimora! Sembra che funzioni anche per NN6 grazie al taroccaggio eseguito da Paolo Carena :-)

      I document.write() si preoccupano di scrivere nel documento HTML i livelli posizionandoli in base alla posizione delle voci negli array, e comunque ponendo il link "Home" alle coordinate specificate all'inizio dello script fra le variabili di personalizzazione. I livelli seguenti si posizionano di conseguenza.
      Delle funzioni che seguono, la prima che ci interessa è coloratutti(col). Se il parametro "col" ha valore true il colore delle voci del sottomenu sarà il colore "attivo" altrimenti sarà quello di default. Questa funzione è comandata dalla funzione che la precede: NascondiMenu(). Come vedete, i menu vengon prima resi attivi, poi, dopo 200 ms, vengono spenti, e successivamente (showdeps(last,false)) nascosti. I questo modo si realizza la seconda delle caratteristiche "originali" che vi ho menzionato all'inizio della scheda.
      Subito prima troviamo un setInterval(). Questo ciclo lavora in congiunzione con la variabile globale conta. Questa variabile inizia con valore "0" nella dichiarazione, e viene gestita dall'event-handler onMouseOver e onMouseOut direttamente nei livelli. Viene incrementata se uno qualsiasi dei livelli (sia dei sottomenu che del menu principale) è attivo, decrementata quando il livello non è più attivo. Di fatto assume volta per volta valore "0" o "1". Il funzionamento è un po' intricato, comunque più o meno è come segue: quando il mouse è su un livello (o link per NN) onMouseOver esegue conta++ che fa assumere alla variabile il valore "1", quando il mouse si sposta, l'onMouseOut la decrementa (conta--) e la variabile torna a "0". Resta a "0" se il mouse è andato fuori dai menu, ma se invece si è spostato su uno dei sottomenu, o su un'altra voce del menu principale riassume immediatamente valore 1. A che serve tutto 'sto giro? Semplice: a nascondere i sottomenu quando il mouse lascia i livelli. Infatti il setInterval() esegue ogni secondo la funzione NascondiMenu() che fa il suo lavoro solo quando la variabile è a "0" quindi quando il mouse ha lasciato tutti i sottolivelli. Se provate a togliere la riga del setInterval() vedrete che i livelli non si chiudono più!
      Successivamente troviamo la funzione MostraMenu(), attivata dai livelli del menu principale, che usa due variabili: "last" e "n", quest'ultima rappresenta il sottomenu da aprire, quindi questa funzione nasconde l'ultimo menu aperto ("last"), apre quello voluto ("n") e ricorda quest'ultimo ("last=n").
      La funzione successiva (showdeps(n,act)), attivata anche questa dai livelli del menu principale, si preoccupa di visualizzare (se act=true) o nascondere (se act=false) il sottomenu "n", non è altro che un ciclo che cambia lo stato (visible/hidden) dei livelli. Anche qui entra in gioco la variabile conta, ma per un motivo più strano. Non sto a spiegarvelo, ma ci sono particolari situazioni (dipendenti da "come" viene spostato il mouse) per cui verrebbe chiuso il menu lasciato, ed il menu da aprire verrebbe aperto ed immediatamente richiuso anch'esso. Mettere qui il controllo se conta==0 ha risolto questo malfunzionamento.
      Segue la funzione vai() che si occupa di caricare il link cliccato. Alla variabile "lev" viene assegnato il livello corrente, e poi con una serie di setTimeout() il livello viene colorato alternativamente del colore "attivo" e "default". L'ultimo setTimeout() cambia la location del browser.
      Le ultime due funzioni mroll() ed unmroll() si occupano di fare il rollover dei colori nel livello su cui è posizionato il mouse, ed anche queste sono banali operazioni di cambio della proprietà bgColor/background (rispettivamente per NN ed IE) in DHTML. Alla funzione mroll() viene passato il nome del livello da gestire sotto forma di stringa, quindi per scegliere la frase da visualizzare nella status bar ho usato il metodo substr() applicato al parametro per ricavare gli indici degli arrays.
      Non dimenticate infine di inserire l'istruzione onResize="self.location.reload()" nel tag <BODY...> del documento.