Jun 11
Volevo segnalarvi questo divertentissimo utilizzo di google maps.
Guidare liberamente all’interno della vostra città, percorrere con una mini vettura le strade che percorrete ogni giorno.
Segnala presso:
Jan 24
Ecco a voi un WebTool veramente eccezionale Yaml Builder.
Infatti il seguente tool permette di costruire un intero layout in maniera grafica (drag & drop) , non solo grazie a Yaml avrete un layout costruito interamente con div e stile associati senza l’ausilio quindi di tabelle
Segnala presso:
Jan 23
Vuoi avere degli effetti carini su testo div e altro all’interno del tuo sito?
Ecco la libreria che fa per te : SimpleJs
Segnala presso:
Jan 22
Ecco un ottimo sito dove potete trovare psd e/o tutorial molto web2 per photoshop
Segnala presso:
Jan 20
Premetto che mi trovo a scrivere questo post grazie ad una segnalazione ricevuta via mail da un lettore.
Penso che sia utile fare un’altra premessa il seguente sito utilizza una piattaforma opensource e molto conosciuta chiamata WordPress e l’effetto applicato sulle immagini è dato da un plug-in chiamato thumbnail-viewer.
la seguente premessa è stata fatta in quanto nella segnalazione che ho ricevuto mi veniva richiesto come facevo ad applicare questo effetto sulle immagini.
Detto questo vorrei presentare un piccolo HowTo su come applicare un effetto molto simile sul proprio sito e senza l’ausilio di questo plug-in .
Una delle librerie più conosciute che permette di avere questo effetto sulle immagini è LightBox
Questo HowTo utilizza infatti questa libreria.
Step 1
Scaricate la libreria da qui scompattatela ed inseriti tutti i file nelle relative directory del vostro sito
Step 2
Lightbox 2 usa come librerie Prototype e scritpaculous, quindi dovrete includere anche esse nella pagina. a questo punto potete inserire all’interno del vostro header e più in particolare tra i tag <head> </head> le seguenti righe
(seguendo l’ordine)
<script type="text/javascript" src="js/prototype.js"></script><script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>Step3
Inserire sempre tra i tag <head> </head> il foglio di stile
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
Step 4
Assicurarsi che i file prev.gif , next.gif, loading.gif, close.gif si trovino nella stessa directory citata nel file lightbox.css
Step 5
A questo punto andiamo ad applicare questo effetto aggiungendo un tag rel ad ogni immagine es.
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
Opzioni
Questa libreria ci mette a disposizione anche un utile opzione e cioè quella di poter ragruppare le immagini in gruppi es.
<a href="images/image-1.jpg" rel="lightbox[montagna]">image #1</a><a href="images/image-2.jpg" rel="lightbox[montagna]”>image #2</a>
<a href="images/image-3.jpg" rel="lightbox[montagna]”>image #3</a>
Tengo a precisare che questa non è l’unica libreria che permette questo effetto, infatti prossimamente scriverò altri HowTo utilizzando appunto altre librerie ed altri frameworks Javascript
Segnala presso:
Nov 19
Oct 03
Questa risorsa vi permette di avere icone,immagini e elementi grafici in formato vettoriale in stile Web 2.0 per un uso non commerciale in maniera gratuita.
Link : FreeVectors
Segnala presso: