disign | Jquery menu stile OS X | a digital sign for a best design!
A digital sign for a best design

Articolo stampato da http://disign.improntedigitali.it/jquery-menu-stile-os-x-195-46-1.html

© Luca Frassineti

Javascript 3.303 visualizzazioni

Jquery menu stile OS X

06/07/2011

La potenza della libreria Javascript Jquery abbatte barriere impensabili, e così anche io, che non posso certo esser definito un fanatico del mondo Apple, ho ceduto alla tentazione di fronte alla semplicissima realizzazione di un menù stile dock di OS X.
La libreria in questione la trovate qui, ed è veramente semplice da implementare.
Nel mio caso (sul sito Impronte digitali) ho inserito il menù di tipo orizzontale.
Occorre prima di tutto realizzare le immagini (attenzione a farle tutte della stessa larghezza altrimenti il ridimensionamento produrrà effetti indesiderati), poi inseriamo nell'head del documento gli embed dei js e del css

script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"  /script

script type="text/javascript" src="js/fisheye-iutil.min.js"  /script

script type="text/javascript" src="js/dock.js" /script

link rel="stylesheet" type="text/css" media="screen" href="css/dock.css"

Non resta che inserire nel div del menù il codice html

div id="dock"
           
div class="dock-container"

a class="dock-item" href="#" img src="dock/nsw.png" alt=""  /a

a class="dock-item" href="#" img src="dock/ths.png" alt=""  /a>

/div

/div

Naturalmente sul sito potete scaricare anche gli altri esempi e leggere tutorial sull'uso più approfonditi.

Invia una domanda o un commento sull'articolo

I campi obbligatori sono segnalati *

*

*



 


Questo sito è totalmente privo di pubblicità, se volete sostenere questa inziativa, potete scegliere di fare una piccola donazione libera:


© 2009 - 2024 Impronte digitali di Luca Frassineti. Tutti i diritti riservati.