È assai strano per me pubblicare post di questo genere.
Ho pubblicato ancora dei tutorial ma mai sulla costruzione di pagine web.
E così questo è il primo.
Avevo promesso a Lantaca di fare questo tutorial sui menu con jQuery perché lui ha fatto il suo tema di Windows.
Così lo scopo di questo tutorial è di creare… l’ambiente desktop di GNOME (l’ambiente desktop che hanno anche distribuzioni GNU Linux). Più precisamente ho usato lo sfondo standard di Debian e anche il suo logo.
Partiamo dall’HTML: ho usato un div in alto con id topmenu contenente una lista per i vari menu principali (Applicazioni, Risorse e Sistema). Degli elementi solo il primo ha una classe con l’unico fine di mettere il logo di Debian.
Dentro ogni elemento c’era uno span.menu-item contenente il nome del menu e un div.menucontent con il contenuto che è fatto sempre a liste.
Il CSS è facile.
Al div#topmenu è stato dato il posizionamento assoluto in alto, altezza di 24px, sfondo etc.
Ai li della lista principale è stato messo float: left; per tenerli ognuno a sinistra dell’altro. … [Leggi il resto]