Visto che serviva sul forum,ho deciso di creare questo script in CSS.
L'ho ottenuto combinando 2 script,il "CSS PopUp Image Viewer" e un elenco semplice in HTML.
Ora vi spiegherō come fare per inserirlo nel vostro forum
La procedura č molto semplice,per prima cosa,inserite questo codice in "Colori e Stili"
CODICE
/*Credits: AlbicoccaBlu del Fredoox Forum */
/*URL: http://fredooxforum.forumcommunity.net */
.bubblewrap {list-style-type:none;
margin: 0;
padding: 0}
.bubblewrap li {display:inline;
width: 65px;
height: 60px}
.bubblewrap li img {width: 55px; /* width of each image.*/
height: 60px; /* height of each image.*/
border: 0;
margin-right: 12px; /*spacing between each image*/
-webkit-transition:-webkit-transform 0.1s ease-in; /*animate transform property */
-o-transition:-o-transform 0.1s ease-in}
.bubblewrap li img:hover {-moz-transform:scale(1.8); /*scale up image 1.8x*/
-webkit-transform:scale(1.8);
-o-transform:scale(1.8)}
Ora,in HTML inserite questo codice dove volete che appaia il menų.
CODICE
<ul class="bubblewrap">
<li><a href="COLLEGAMENTO_1"><img src="IMMAGINE_1" title="titolo_1" /></a></li>
<li><a href="COLLEGAMENTO_2"><img src="IMMAGINE_2" title="titolo_2" /></a></li>
<li><a href="COLLEGAMENTO_3"><img src="IMMAGINE_3" title="titolo_3" /></a></li>
<li><a href="COLLEGAMENTO_4"><img src="IMMAGINE_4" title="titolo_4" /></a></li>
<li><a href="COLLEGAMENTO_5"><img src="IMMAGINE_5" title="titolo_5" /></a></li>
</ul>
Ora andiamo a modificare...
Dove trovate scritto COLLEGAMENTO_1/2/3/4/5 dovete inserire i vari link ai quali varrā indirizzato l'utente cliccando su una delle icone...Quindi,ogni icona ha il suo link,in tutto sono 5.
Ora andiamo a vedere le immagini. Dovete sostituire con IMMAGINE_1/2/3/4/5 le varie icone del menų. Quindi,per esempio potete fare in modo che:
La prima porti alla vostra Home.
La seconda alla vostra pagina facebook.
La terza a una pagina di risoluzione problemi.
La quarta al regolamento
E la quinta a una sezione dove proporre le idee...
Eccovi un esempio di questa condizione elaborato per voi:
CODICE
<ul class="bubblewrap">
<li><a href="http://vostroforum.forumcommunity.net"><img src="icona" title="Home" /></a></li>
<li><a href="http://www.vostrapaginafacebook.com"><img src="icona" title="Add to Facebook" /></a></li>
<li><a href="http://www.vostrapaginafacebook.com"><img src="icona" title="Problemi" /></a></li>
<li><a href="http://vostroforum.forumcommunity.net/?f=IDSEZIONE"><img src="icona" title="Regolamento" /></a></li>
<li><a href="http://vostroforum.forumcommunity.net/?f=IDSEZIONE"><img src="icona" title="Proponi le tue idee" /></a></li>
</ul>
Ovviamnete dove modificare
CODICE
http://vostroforum.forumcommunity.net
CODICE
http://www.vostrapaginafacebook.com
e
CODICE
http://vostroforum.forumcommunity.net/?f=IDSEZIONE
con i vostri indirizzi web e le vostre icone
Crediti
Se usufruite di questo script,dovete inserire,in una parte qualsiasi del forum (purchč sia visibile) questo codice:
HTML
<table border="1" cellpadding="2" width="100%" cellspacing="0">
<tr>
<td align="center"><b>Script <A href="http://darkandlight.forumcommunity.net/?t=44749498">"Menų Bublewrap"</a> Sviluppato da <A href="http://fredooxforum.forumcommunity.net/?act=Profile&MID=5449768">AlbicoccaBlu</a> del <a href="http://fredooxforum.forumcommunity.net>Freedoox Forum</a></b>
</table>
Verrā una cosa del genere:
Edited by AlbicoccaBlu - 27/6/2011, 10:07
