Pubblicato da: Spacca
 | Questo tutorial è offerto da FORUMATTIVO.COM All rights reserved to forumattivo inc. |
>
Prima di tutto spieghiamo di cosa stiamo parlando:
la jquery e' una libreria javascript formata da una serie di funzioni CSS HTML e QUERY per le diverse operazioni che si possono effettuare con questo strumento..come e' divisa
Gli script
- Code: ----------Selezionare il contenuto
<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript"src="http://addthis.com//cms-content/images/gallery/fisheye-iutil.min.js"></script>
Il css
- Code: ----------Selezionare il contenuto
<style type="text/css">
.dock-container { position: relative; top: -8px; height: 50px; padding-left: 20px; }
a.dock-item { display: block; width: 50px; position: absolute; bottom: 0; text-align: center; text-decoration: none; color: #333; }
.dock-item span { display: none; padding-left: 20px; }
.dock-item img { border: 0; margin: 5px 10px 0px; width: 100%; }
</style>
Lo script con la funzione che vogliamo che svolga
- Code: ----------Selezionare il contenuto
<script type="text/javascript">
jQuery.noConflict()(function () {
// Dock initialize
jQuery.noConflict()('#dock').Fisheye(
{
maxWidth: 30,
items: 'a',
itemsText: 'span',
container: '.dock-container',
itemWidth: 50,
proximity: 60,
alignment : 'left',
valign: 'bottom',
halign : 'center'
}
);
});
</script>
I div per il collegamento immagini link con la funzione
- Code: ----------Selezionare il contenuto
<DIV id=dock> <DIV class=dock-container>
<A class=dock-item href="url "><SPAN>nome1</SPAN><IMG alt=home src="immagine"></A>
<A class=dock-item href="url"><SPAN>nome2</SPAN><IMG alt=contact src="immagine"></A>
</DIV>
se volete aggiungere altre stringhe non dovete fare altro copia/incolla con quelle gia presenti
detto questo una volta copilato tutto come preferite..non dovete far altro che incollarlo sull'indice del forum . Vederlo cosi sembra molto difficile ..ma vedrete che con i link che seguono sotto la cosa e' piu facile dirla che farla...visto che vi viene messo tutto a disposizione..
questo sono due esempi :
esempio Menu orizzontale
-Attenzione queste funzioni contengono diversi script...inseire molti script sul forum puo' creare dei problemi.Lo staff non si assume nessuna responsabilita' per i malfunzionamenti dovuti a una scorretta gestione del codice.
Tutoriale da :The crow
Copyrigth © FORUMATTIVO.COM
Profilo utente
Social
Messaggi privati
Soggetti controllati
Staff tools