Livello di difficoltà: |
|
Dynamic Html è una tecnologia approvata dal W3C per la creazione di siti Web dinamici ed interazioni client side con l'utente. In questa sezione sono disponibili centinaia di esempi ed arretrati della mailing list "Una demo Dhtml a settimana".
|
|
Menù ad albero modello gestione risorse
Arretrati lista "Una demo Dhtml a settimana"
CONOSCENZE CONSIGLIATE PER QUESTO ARTICOLO: Html, Css, Javascript
COMPATIBILITÀ: Ms Ie, Netscape
FILES ESTERNI: ftiens4.js, photosturism.js
Visualizza la demo
Scarica la demo
Un sito Internet, più è ricco di notizie, più viene visitato. Le
informazioni però devono essere facilmente reperibili, e la regola dei tre
clicks al massimo è sempre valida. Per raggiungere ciò che cerca, una volta
entrato in un Web site, l'utente non deve fare più di tre pressioni sul
tasto del mouse. Per facilitare il nostro lavoro di Web master, un menù
dinamico è un ottimo strumento per semplificare le operazioni del
visitatore.
Questa settimana esamineremo un ottimo menù ad albero simile a quelli
presenti in Windows 9x/Nt e 2000, come Gestione Risorse. L'esempio è composto da un file .htm (esempio.htm) richimanti gli archivi esterni in Javascript, due
files .js (ftiens4.js e photosturism.js) contenenti la sintassi scripting e
ben undici immagini gif, che simulano i +, i - e gli altri segni tipici di un menù ad abero modello Microsoft.
Esempio.htm, come abbiamo detto, richiama i due files .js e per questo non
va modificato in nessuna parte. Neanche ftiens4.js va modificato perché il
codice che racchiude serve da motore alla demo. Per personalizzare le voci e
il loro numero, bisogna agire su photosturism.js. In esso, sono contenuti i
nomi delle cartelle, dei files ed il percorso a cui portano. Prendiamo per
esempio la seconda directory:
aux1 = insFld(foldersTree, gFld("America", "file.htm"))
aux2 = insFld(aux1, gFld("Canada", "file.htm"))
insDoc(aux2, gLnk(2, "Montreal", "file.htm"))
aux2 = insFld(aux1, gFld("United States", "file.htm"))
insDoc(aux2, gLnk(2, "Boston", "file.htm"))
insDoc(aux2, gLnk(2, "New York", "file.htm"))
insDoc(aux2, gLnk(2, "Washington", "file.htm"))
La variabile "aux1" indica che si tratta di una cartella di primo livello.
Ovviamente, "aux2" ne indicherà una di secondo livello e così via.
La voce "insDoc" definisce la presenza di un file. In presenza di
insDoc(aux2, gLnk(2, "Montreal", "file.htm"))
si avrà un file contenuto nella cartella di secondo livello (aux2,gLnk(2,).
Per avere un file in una directory di livello primo:
insDoc(aux1, gLnk(1, "Montreal", "file.htm"))
Se volessimo quindi inserire un file nella cartella di primo livello
America, dovremmo modificare il codice nel modo seguente:
aux1 = insFld(foldersTree, gFld("America", "file.htm"))
aux2 = insFld(aux1, gFld("Canada", "file.htm"))
insDoc(aux2, gLnk(2, "Montreal", "file.htm"))
aux2 = insFld(aux1, gFld("United States", "file.htm"))
insDoc(aux1, gLnk(1, "Clinton", "file.htm"))
insDoc(aux2, gLnk(2, "Boston", "file.htm"))
insDoc(aux2, gLnk(2, "New York", "file.htm"))
insDoc(aux2, gLnk(2, "Washington", "file.htm"))
La disposizione delle cartelle e dei files è a nostro completo piacimento.
E' consigliabile però seguire le impostazione di Windows e inserire prima
le cartelle e poi i files, possibilmente in ordine alfabetico, in modo da
rendere più reale l'esempio Dhtml.
|