Fancy menu: “miracoli” con css e javascript

Guillermo l’ha chiamato Fancy menu. Guillermo Rauch dice di essere Argentino, avere 16 anni e di sviluppare per il web da 6. L’età forse è un bluff. Il menu, una figata.

Css, e javascript – meglio: un menu che sfrutta alcuni effetti grafici forniti da Mootools e li combina con un uso intelligente e creativo del css. Risultato: vedi il post di Guillermo sul suo blog.

Un menu di navigazione (orizzontale, nell’esempio), un elemento di sfondo che si muove, e corre nel menu per andare a evidenziare l’elemento su cui puntiamo il mouse.

Il post di Guillermo spiega molto bene anche come implementare il menu. Esiste anche un pacchetto zip, con una release provvisoria, non perfetta ma comunque preziosa (il codice in verità credo sia lo stesso, ma forse mancano le immagini .gif e da un problema con le trasparenze in IE).

Il menu è piaciuto molto – non solo a me. In meno di un mese, 185 commenti al post sul blog, 1750 persone che hanno segnalato l’articolo su digg. E una utile traduzione italiana, grazie a sickbrain.org.

(Ieri ho fatto un primo mio fancy menu di test ;-) Aggiornerò il post con uno o due esempi miei, – prima o – poi).

About these ads

6 risposte a Fancy menu: “miracoli” con css e javascript

  1. sughero scrive:

    scusami ma come si inserisce un qualsiasi script java su wordpress.com, qui siamo ospiti, senza l’upgrade io non riesco a modificare il sorgente html

  2. carl0z scrive:

    ciao sughero,

    qui su wp.com non puoi inserire script js a tuo piacimento – non come normal user, almeno.

    il blog di giullermo, come moltissimi altri, è ospitato su un qualche server esterno (e usa il codice di wp.org).

    per cui il menu in questione (fancy menu) lo possono usare loro.
    e noi in un qualsiasi altro sito + nostro, dove possiamo smanacciare di + che qui

    ciao
    carloz

  3. sughero scrive:

    ah grazie ok.. avevo capito bene allora :(

  4. Davide scrive:

    Riesco ad inserire il menu fancy nel mio blog wordpress; ma quanco includo il come nel file scaricabile dal sito di Guillermo i file mootools.js menu.js e main.js il tutto sembra funzionare, ma quando clicco su un link non mi cambia la pagina seguendo l’href; quando invece matto al posto del main.js il file devthought.js i link mi vanno; ma non mi va più l’effetto dei bottoni.

    ho inserito il menu:

    Home
    Plant a tree
    Travel
    Ride an elephant

    dentro il div dell’immagine dell’header del wordpress

    Secondo voi come posso fare

  5. alikon scrive:

    Qualcuno può inviarmi il codice un link funzionante con un esempio
    il sito dell’autore non è raggiungibile

    grazie

  6. cbeschi scrive:

    ciao alikon,

    magari domani torna su, il sito, boh …

    in caso, nel whois del dominio, guillermo indica questa mail: rauchguillermo@yahoo.com

    scrivigli :-O

    carloz

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...

Iscriviti

Ricevi al tuo indirizzo email tutti i nuovi post del sito.

%d blogger cliccano Mi Piace per questo: