Swap image

[happyandrea]

Ciao a tutti

Sto creando un sito gallery utilizzando questo codice:

var image1URL = "images/immagine.jpg";

function changeImage1() {
     if (document.images) {
          if (image1URL == "images/immagine.jpg") image1URL = "images/immagine_grande.jpg";
          else image1URL = "images/immagine.jpg";

         document.image1.src = image1URL;
     }
}


Che al click su immagine.jpg sostituisce la stessa con immagine_grande.jpg

Funziona tutto, nel sito che sto creando però ho bisogno di utilizzare parecchie volte questo codice, su diverse immagini. Questo mi obbliga a creare diverse funzioni changeImage, ognuna con i nomi delle immagini diversi.

CENTO funzioni per CENTO immagini?

Pensavo però (purtroppo non ho grandi conoscenze di JS) ad un codice singolo utilizzabile per tutte le foto. Magari impostando come immagine di sostituzione lo stesso nome ma con un suffisso.

Può esistere?

Grazie in anticipo

[cavicchiandrea]

Vedi se questo potrebbe andar bene http://highslide.com/ ma di cose simili in rete ne trovi diversi google "gallery javascript"

[happyandrea]

Grazie per la risposta,

conosco highslide e lighbox, ma vorrei solamente un piccolo codice per fare quello che ho scritto sopra, non qualcosa di così complesso. Anche per capire meglio JS

[cavicchiandrea]

In tal caso se le immagini sono con nomi diversi per fare tutto con una funzione sola dovrai crearti un array con i nomi delle immagini e un ciclo for per contarle tipo cosi (molto a grandi linee):

var image1URL = new Array("images/immagine.jpg","images/immagine1.jpg","images/immagine100.jpg")

function changeImage1(Image) {
for(var i=0; i<image1URL.length; i++){
     if (document.images) {
          if (image1URL[i] == Image) image1URL = "images/"+Image+"_grande.jpg";
          else image1URL = "images/immagine.jpg";

         document.image1.src = image1URL;
     }
  }
}

qui metti l'immagine piccola 1
qui metti l'immagine piccola 2
qui metti l'immagine piccola 3
etc....
Lascio a te i dettagli per fare funzionare il tutto, questo è solo un indicazione.

[happyandrea]

Grazie per la risposta!

Da quel poco che so di JS sono arrivato a questo codice. Non funziona e non riesco a
venirne a capo.

JS:

var image1URL = new Array("images/immagine1.jpg","images/immagine2.jpg","images/immagine100.jpg")

function changeImage1(Image) {
for(var i=0; i<image1URL.length; i++){
     if (document.images) {
          if (image1URL[i] == "images/"+Image+".jpg") image1URL = "images/"+Image+"_grande.jpg";
          else image1URL = "images/"+Image+".jpg";

         document.image1.src = image1URL;
     }
  }
}

html:

<a href="#" onclick="changeImage1('immagine1')"[img]images/immagine1.jpg[/img]</a>

Grazie per l'aiuto!