Switch di immagine a seconda del link cliccato.

[FedeZzZ]

Ciao. Sto studiando javascript e in un'esempio non capisco come mai non mi funziona il codice.

Questa linea di codice js...

var va = document.getElementById('vista');

l'ho utilizzata in un file js esterno alla mia pagina html (file js linkato nell'head) per modificare l'attributo SRC di un'immagine presente nella pagina. In pratica io ho una serie di immagini che voglio che al loro click cambino il contenuto di quell'immagine. Allora nella pagina ho fatto una cosa del genere:

[img]catalogo/vuoto.png[/img]

[img]catalogo/1.png[/img]

[img]catalogo/2.png[/img]

Pero' se per esempio clicco sul primo link non mi cambia l'immagine con l'id=vista , ma mi carica una pagina nuova con l'immagine che dovrebbe andare dell'attributo href, cosa che dovrebbe fare solo se javascript è disabilitato.

Prima utilizzavo questa forma funzionante del codice:

[img]catalogo/vuoto.png[/img]

[img]catalogo/1.png[/img]

[img]catalogo/2.png[/img]

che l'ho eliminata perchè volevo passare alla versione descritta all'inizio, poichè va è + corto da scrivere di document.images['vista'].src, capite?.

Sapete indicarmi come far funzionare il tutto usando il primo esempio riportato? grazie!

[FedeZzZ]

nessuno sa nulla?

[Xinod]

se richiami questo, nudo e crudo, nell' head
var va = document.getElementById('vista');
avrai un errore, parli di elementi che non ancora esistono nel documento

se questa variabile la valorizzi in una funzione richiamata onload, essa deve essere globale per poter essere usata fuori dalla funzione, quindi va tolto il var

window.onload=function(){
va = document.getElementById('vista');
}

[dwj]

Prova a seguire questo tutorial, che peraltro utilizza anche un codice più pulito

http://alistapart.com/articles/imagegallery

ciao ciao

[FedeZzZ]

xinod effetivamente hai ragione qnd dici che il documento non si è ancora generato, pero' lo script continua a non funzionare, mi fa lo stesso problema di prima, carica le immagini in una nuova pagina.

E' come se il browser non eseguisse la funzione sul gestore di evento onload dell'oggetto window, xkè dopo che ho visto che non funzionava ho provato a mettere, dopo la definizione di va, questo un alert con argomento va, per vedere cosa mi dava, invece non fa vedere proprio neanche la finestrina di alert.

Provo con quello che mi ha detto dwj...

[FedeZzZ]

Ho risolto il problema prendendo spunto dal tutorial di a list apart, modificandolo leggermente per il mio sito, e aggiungendoci un piccolo metodo dell'api core.

cosi...

function showPic (pic) {
	if (document.getElementById) {
		document.getElementById('vista').src = pic.href;
		document.getElementById('vista').setAttribute('alt', pic.childNodes[0].getAttribute('alt'));
		return false;
	} else {
		return true;
	}
}

grazie cmq a chi mi ha risposto nel topic, alla prossima, ciao!