Immagine random nella home del Sito? Si, con Javascript!
Immagine random nella home del Sito? Si, con Javascript!
Domenica 25 Aprile 2010 08:01 | 
Scritto da Emiliano Berardi | 
| 
| 
In questo articolo, un semplice tutorial per inserire immagini random nella Home o in altre pagine del vostro Sito WEB.
Avere immagini random nella home o in altre pagine del Sito può essere un ottimo metodo per presentare ai visitatori qualcosa di sempre "diverso".
La soluzione per ottenere questo senza dover ricorrere a linguaggi e tecnologie lato-server è il Javascript: con poche e semplici righe di codice è possibile avere immagini che cambiano casualmente ad ogni nuovo caricamento della pagina.
Per prima cosa, occorre inserire lo script che carica le immagini all'interno del tag <head> del sito - ecco lo script:
<script language="Javascript">
<!--
function image() {};
image = new image();
number = 0;
image[number++] = "<img src='nomeimmagine1.jpg'>"
image[number++] = "<img src='nomeimmagine2.jpg'>"
image[number++] = "<img src='nomeimmagine3.jpg'>"
increment = Math.floor(Math.random() * number);
//-->
</script>
Ovviamente, dovrete modificare ciascuna delle righe che richiamano le immagini:
image[number++] = "<img src='nomeimmagine1.jpg'>"
indicando il percorso ed il nome reale delle immagini sul vostro Sito all'interno di "<img src='percorso & nome immagine'>"
Quindi, dovrete richiamare l'esecuzione dello script nella pagina, nel punto della pagina in cui volete che l'immagine random venga visualizzata (all'interno di una tabella, di un div o di un blocco di contenuti) - in questo modo:
<script language="JavaScript"> document.write(image[increment]); </script>
Per avere più immagini visualizzate in random basterà aggiungere righe di richiamo immagini all'interno dello script stesso nell'head della pagina.
Un ottimo esempio di implementazione dello script presentato in questo articolo è il nuovo Sito WEB di Giuseppe Bilotti - noto Direttore della Fotografia in ambito cinematografico e pubblicitario - www.giuseppebilotti.com.
Come potrete notare, l'immagine grande che fa da testata al Sito cambia ogni volta che viene caricata la Home Page - mostrando ad uno ad uno gli screenshots dei commercials girati da Bilotti negli ultimi anni - sino ad ora - della brillante carriera.
Articoli correlati:
 Template WordPress GRATIS 3 colonne: Green Style 2011 {flike}
Il Template per WordPress (a 2 o 3 colonne) Green Style 2011 by EBGraf è elegante e fresco allo stesso tempo; è adatto ad ogni tipo di sito o Altri...
|
 Template WordPress GRATIS 3 colonne: YL Modern Blue {flike}
Il Template 3 colonne per WordPress YL Modern Blue ripropone la grafica elegante e vivace della versione rilasciata per Joomla! (vedi qui Altri...
|
 Template Joomla! 1.6 Layout Fluido: Fluid Business 2011 {flike}
Template a layout fluido per Joomla! 1.6 completamente crossbrowser e perfettamente compatibile anche con la versione 1.5.x di Joomla.Design sobrio Altri...
|
 Template per Joomla! 1.6 GRATIS: YL Modern Blue by EBGraf Il Template 3 colonne per Joomla! 1.6 (compatibile anche con la collaudata versione 1.5.x del CMS) YL Modern Blue ha uno splendido e curato layout azzurro con Altri...
|
 Template Drupal - Africa On Line by EBGraf Il nuovo Template per Drupal offerto gratis da EBGraf è "Africa On Line", colori caldi di tramonto equatoriale, sfondo texturizzato pelle, Layout 2 colonne Altri...
|
 Template Drupal - Portale Di Notte by EBGraf Il Template "Portale Di Notte" per Drupal presenta un layout a 3 colonne con menu superiore a tendina, reso suggestivo dai colori e dagli effetti di Altri...
|
Email - preventivi:
info@ebgraf.com (24h/24)
Tel: 328/3564305
(dal lunedì al venerdì
9:30/12:00 - 15:30/18:00)
Templates personalizzati per Joomla, Drupal, WordPress e DotNetNuke a richiesta!!
- Scaricare mp3 g...
A fare cosa? Leggi... - Scaricare mp3 g...
sto entrando per la prima volta, non sono pratico,... Leggi... - Scaricare mp3 g...
non ho il sito web Leggi... - Scaricare mp3 g...
non ho sito web Leggi... - Immagine random...
grazie mille per il tuo aiuto l'ho subito utilizza... Leggi...
| Visite Oggi: | 4 |
| Visite Ieri: | 83 |
| Visite questo mese: | 1841 |
| Visite Totali | 81211 |
| Online dal | 2010-03-01 |
Commenti
RSS feed dei commenti di questo post.