Question about Image swapping within arrays

Dev Shed Forums Sponsor:

February 16th, 2005, 06:12 PM

MikeRed

Registered User

Join Date: Jan 2005

Posts: 22

Time spent in forums: 6 h 12 m 42 sec
Reputation Power: 0

Question about Image swapping within arrays

hello, I'm trying to create a project, and part of it includes using arrays with image swapping. Here's simplified code to show what I'm trying to do.

Code:

<script>

var imgArray = new Array(2);
imgArray[0] = new Image();
imgArray[0].src = "blue.gif";


function swapImage(){
document[imgArray[0]].src = "1.gif";
}


</script>

<img src="blue.gif" onClick="swapImage();">

and the error i get is:

Error: document[imgArray[0]] has no properties on line 9 (the error is from the firefox console.)

Also, the images don't display at all in internet explorer...hrm

Anyways, thanks for all the help you give,

Mike.

February 16th, 2005, 07:03 PM

Saint Jude

Contributing User

Join Date: Aug 2004

Posts: 455

Time spent in forums: 2 Days 3 h 4 m 22 sec
Reputation Power: 9

1. imgArray[0] holds an image (ref), so document[imgArray[0]] will not be useful. (very old syntax too).

2. The image element in the document is entirely unrelated to the image object created in the script.

Images created with the Image constructor are usually purely for the purposes of preloading.
They needn't ever be referenced in the script again. If part of an array, they might be used as a convenient
way of grabbing a source string (alt. ver. below).

You won't see scripts where such image objects become a part of the document, although it is possible to insert them.

You want this (or like it):

PHP Code:


		
			
<script>
 
var imgArray = new Array(2);
imgArray[0] = new Image();
imgArray[0].src = "1.gif";
 
 
function swapImage(){
    document.getElementById(img0).src = "1.gif";
    // alt. // document.getElementById(img0).src = imgArray[0].src;
}
</script>
 
<img id="img0" src="blue.gif" onClick="swapImage();">

February 16th, 2005, 07:11 PM

Glen Rowell

Contributing User

Join Date: Dec 2004

Location: Japan

Posts: 410

Time spent in forums: 1 Day 13 h 34 m 52 sec
Reputation Power: 9

Is it the same for JavaScript?

February 16th, 2005, 09:33 PM

Kravvitz

CSS & JS/DOM Adept

Dev Shed God 30th Plane (19500 - 19999 posts)

Join Date: Jul 2004

Location: USA

Posts: 19,835

Time spent in forums: 6 Months 1 Day 22 h 11 m
Reputation Power: 4192

Glen, what are you asking?

__________________
Spreading knowledge, one newbie at a time. I'm available for hire at Dynamic Site Solutions.

Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

Remember people spend most of their time on other people's sites (so don't violate web design conventions).