JS: script per cambio scr di immagine

[99caos]

Sto modificando un vecchissimo script che sostituiva il percorso scr di un'immagine tramite l'evento onMouseOver.

ecco lo script

<script type="text/javascript">
<!--
function changeimage(towhat,url){
	if (document.images){
		document.images.targetimage.src=towhat.src
		gotolink=url
	}
}
function warp(){
	window.location=gotolink
}
//-->
</script>
<script type="text/javascript">
<!--
var myimages=new Array()
var gotolink="#"
function preloadimages(){
	for (i=0;i<preloadimages.arguments.length;i++){
		myimages[i]=new Image()
		myimages[i].src=preloadimages.arguments[i]
	}
}
preloadimages("imag/thumb1.jpg","imag/thumb2.jpg",
"imag/thumb3.jpg","imag/thumb4.jpg",
"imag/thumb1b.jpg","imag/thumb2b.jpg",
"imag/thumb3b.jpg","imag/thumb4b.jpg")
//-->
</script>

Lo script è in grado di modificare una sola immagine attraverso l'attributo name='targetimage'

esempio di immagine da sostituire:

[img]img/thumb1.jpg[/img]

esempio di link attivo per la sostituzione:

Entra nel Sito

Ora volevo modificarlo affinchè si cambiassero 4 immagini e non più una.

Così ho prima creato le 4 img con 4 name diversi: name=targetimage1, name=targetimage2, etc

poi ho modificato l'evento del link in questo modo:

Entra nel sito

e di conseguenza ho modificato lo script così:

function changeimage(whatImg,towhat,url){
	if (document.images){
		document.images.whatImg.src=towhat.src
		gotolink=url
	}
}

Ma mi dice che whatImg è nullo...

Dove ho sbagliato?
Così strutturato lo script è molto poco pratico.
Sarebbe più comodo usare array multidimensionali e fare una sola chiamata che gestisce tutti e quattro i link:

onMouseOver="
changeimage(myimagesGroup[0],this.href);"

function changeimage(towhatGroup,url){
	if (document.images){
		document.images.targetimage1.src=towhat[0].src
		document.images.targetimage2.src=towhat[1].src
		document.images.targetimage3.src=towhat[2].src
		document.images.targetimage4.src=towhat[3].src
		gotolink=url
	}
}

function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++){
	for (j=0;j<preloadimages[i].arguments.length;j++){
		myimages[i][j]=new Image()
		myimages[i][j].src=preloadimages.arguments[i][j]
	}
}
}

preloadimages(
0 ("imag/thumb1.jpg","imag/thumb2.jpg","imag/thumb3.jpg",
"imag/thumb4.jpg"), 1("imag/thumb1b.jpg","imag/thumb2b.jpg","imag/thumb3b.jpg",
"imag/thumb4b.jpg"),
etc...)

Solo che sono troppe le cose di JS che non conosco ancora e non so da dove cominciare...

Mi indichereste anche solo quale strada seguire?

[99caos]

Perchè non funziona?

function preloadimages(){

	myimages[0] = new Array("img/thumb1.jpg","img/thumb2.jpg",
"img/thumb3.jpg","img/thumb4.jpg")
	myimages[1] = new Array("img/thumb1b.jpg","img/thumb2b.jpg",
"img/thumb3b.jpg","img/thumb4b.jpg")
	myimages[2] = new Array("img/thumb1.jpg","img/thumb2.jpg",
"img/thumb3.jpg","img/thumb4.jpg")
	myimages[3] = new Array("img/thumb1b.jpg","img/thumb2b.jpg",
"img/thumb3b.jpg","img/thumb4b.jpg")
	myimages[4] = new Array("img/thumb1.jpg","img/thumb2.jpg",
"img/thumb3.jpg","img/thumb4.jpg")

	for (i=0;i<5;i++){

		for (j=0;j<3;j++){
			loadedimages[i][j]=new Image()
			loadedimages[i][j].src=myimages[i][j]
		}

	}

}

[Xinod]

loadedimages=new Array();
	for (i=0;i<5;i++){
loadedimages[i]=new Array();
		for (j=0;j<3;j++){
			loadedimages[i][j]=new Image()
			loadedimages[i][j].src=myimages[i][j]
		}

	}

[Xinod]

onMouseOver="changeimage('targetimage1',myimages[0],this.href);

il nome e' una stringa, vuole gli apici

ci sono altri errori

[99caos]

Ottimo per la prima risposta.

Ora però pare che ci sia qualcosa che mandi in loop lo script

devo capire cosa

[99caos]

Benissimo!
Ora tutto funziona.

Per chi volesse usarlo:

<script type="text/javascript">
<!--
function changeimage(i){
	if (document.images){
document.images.targetimage1.src=loadedimages[i][0].src
document.images.targetimage2.src=loadedimages[i][1].src
document.images.targetimage3.src=loadedimages[i][2].src
document.images.targetimage4.src=loadedimages[i][3].src
	}
}

var myimages=new Array()

function preloadimages(){

	myimages[0] = new Array("img/thumb1.jpg","img/thumb2.jpg",
"img/thumb3.jpg","img/thumb4.jpg")
	myimages[1] = new Array("img/thumb1b.jpg","img/thumb2b.jpg",
"img/thumb3b.jpg","img/thumb4b.jpg")
	myimages[2] = new Array("img/thumb1.jpg","img/thumb2.jpg",
"img/thumb3.jpg","img/thumb4.jpg")
	myimages[3] = new Array("img/thumb1b.jpg","img/thumb2b.jpg",
"img/thumb3b.jpg","img/thumb4b.jpg")
	myimages[4] = new Array("img/thumb1.jpg","img/thumb2.jpg",
"img/thumb3.jpg","img/thumb4.jpg")

	loadedimages=new Array();

	for (i=0;i<5;i++){

		loadedimages[i]=new Array();

		for (j=0;j<4;j++){
			loadedimages[i][j]=new Image()
			loadedimages[i][j].src=myimages[i][j]
		}

	}

}

preloadimages()


//-->
</script>

Html:

<div id="img">
[img]img/thumb1.jpg[/img]
[img]img/thumb2.jpg[/img]
[img]img/thumb3.jpg[/img]
[img]img/thumb4.jpg[/img]
</div>


Entra nel Sito

Enjoy