Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial

Sfondo a scelta

Link copiato negli appunti

Lo script che presentiamo permette di far selezionare, ai nostri visitatori, degli sfondi a piacere con la possibilità di poter variare continuamente la scelta.
Lo script è compatibile con Netscape 6 ed Internet Explorer mentre con NN 4.x l'effetto non verrà visualizzato ma non ci saranno problemi di incompatibilità.
L'unico accorgimento da seguire è di scegliere immagini non troppo pesanti in modo da velocizzare le operazioni di caricamento.

L'esempio si compone di 5 file:

  • esempio.htm
  • sfondo1.gif
  • sfondo2.gif
  • sfondo3.gif
  • sfondo4.gif

Per una più semplice comprensione del presente script fai continuamente riferimento ai file sopracitati, verificando le procedure e i dati espressi. Solo in questo modo, con un continuo confronto, comprenderai le peculiarità di questo Javascript.

Inseriamo questo codice tra i tag <head> della pagina:

<script type="text/javascript" language="javascript">

</script>

La personalizzazione è molto semplice e richiede di impostare, negli Array, i nomi dei nostri sfondi.

backImage[0] = "sfondo1.gif";
backImage[1] = "sfondo2.gif";
backImage[2] = "sfondo3.gif";
backImage[3] = "sfondo4.gif";
backImage[4] = "";

Le possibilità di inserimento sono infinite e basterà seguire l'ordine progressivo tra le parentesi quadrate. Da notare che il V° Array non contiene nessuno sfondo e questo servirà per impostare un background neutro.
Nel corpo della pagina, invece, dobbiamo inserire i link che richiamano la funzione del javascript. In questo caso abbiamo due possibilità: cambiare lo sfondo con evento onMouseOver oppure con evento onClick.

<a href="#" onMouseOver="javascript:change(0)">Sfondo 1(onMouseOver)</a>
<a href="javascript:change(1)">Sfondo 2 (onClick)</a>

<a href="#" onMouseOver="javascript:change(0)">Sfondo 1(onMouseOver)</a>

In questo primo caso basterà passare con il mouse sopra il link per cambiare il background

<a href="javascript:change(1)">Sfondo 2 (onClick)</a>

Nel secondo caso bisognerà cliccare sul link per effettuare la scelta
In una stessa pagina. come già detto, possiamo mettere un numero illimitato di scelte; l'importante sarà non inserire immagini troppo pesanti per evitare un rallentamento.
Altre modifiche allo script non sono necessarie.


Ti consigliamo anche