Oggi è sempre più diffuso la pubblicazione di fotografie sul web, che permettono di condividere esperienze ed emozioni, allora perchè non mostrarle con stile . Lo Slide Show proposto, permette di visualizzare le foto pubblicate, mettendo in evidenza la bellezza delle pose, creando un effetto molto interessante.
I file da utilizzare sono lytebox.css che gestisce la grafica dello Slide Show e lytebox.js che si occupa delle funzioni .
Richiamiamo il foglio di stile e lo script nella nostra pagina web con il seguente codice
<script type="text/javascript" language="javascript" src="lytebox.js"></script> <link rel="stylesheet" href="lytebox.css" type="text/css" media="screen" /> |
Realizziamo la nostra galleria di immagini in sequenza con il seguente codice
<a href="prima_foto.jpg" rel="lyteshow[vacation]" title="inserire il titolo"><img src= "prima_foto.jpg"></a> <a href="seconda_foto.jpg" rel="lyteshow[vacation]" title="inserire il titolo"><img src= "seconda_foto.jpg"></a> <a href="terza_foto.jpg" rel="lyteshow[vacation]" title="inserire il titolo"><img src= "terza_foto.jpg"></a> Ecc.... |
Se invece vogliamo mostrare le foto singolarmente basterà inserire il seguente codice
<a href="prima_foto.jpg" rel="lyteshow[vacation]" title="inserire il tutlo"><img src= "prima_foto"></a> <a href="seconda_foto.jpg" rel="lyteshow[vacation]" title="inserire il tutlo"><img src= "seconda_foto"></a> Ecc.... |
E' possibile configurare alcuni parametri dello SlideShow aprendo lo script con un editor di testo. Alla riga Configure Slideshow Options è possibile variare il tempo di permanenza delle immagini espresso in millesecondi e altri parametri che riguardano la grafica dello Slide Show.
Scarica qui un esempio SlideShow file zip 331 KByte
Clicca sulle immagini per visualizzare un esempio
Visualizzatore Immagini singole
Gruppo di immagini in sequenza
Slide Show fantasy foto15 foto45