Forum Moderators: open

Message Too Old, No Replies

Can't swap images if image is in a DIV

Also can't reference an array with a variable name

         

MichaelBluejay

8:28 am on Nov 26, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Two things have me stumped:

(1) I've been happily swapping images for years with document.images.pookie.src='newimage.jpg', but now as soon as I put the image inside a DIV that no longer works -- nothing happens when I click the link that's supposed to swap the image. I tried getting the object reference of the DIV and using <theDivObj.images.pookie.src> and <window.theDivObj.images.pookie.src>, but no such luck. Is there a way to do this, or do I lose the image-swapping feature for good when I put the image inside a DIV?

(2) In other news, I'd like to use use a variable to refer to an array but JavaScript doesn't understand that. For example. I define some arrays....

window.a = new Array("...");
window.b = new Array("...");

And then I try to reference that array like so...

<A href="javascript:thefunction('a'); return false">Click me</A>

function thefunction(whichArray) {
alert(window.whichArray[3]);
}

The alert tells me "undefined".

Surely there's a way to do this, no? Thanks for your help.

DrDoc

5:55 pm on Nov 26, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



You're passing "a" to the function... The variable "whichArray" is a regular scalar variable, and simply holds the value "a". It does not automagically serve as a reference to a previously defined variable/array. You need to tell the script to evaluate the value of "whichArray"...

function thefunction(whichArray) {
alert(eval(whichArray)[3]);
}

Bernard Marx

6:18 pm on Nov 26, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I won't go on an anti-eval rant today.
Just

function thefunction(whichArray) {
alert(window[whichArray][3]);
}

The variables do not need to be explicitly declared as window properties for this to work. All global values already are.

Bernard Marx

6:31 pm on Nov 26, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



-------------------------------
Re: images

Sounds strange that.

theDivObj.images.pookie.src - ouch!

Give the image an id, and reference it from the document, so:

document.getElementById("_image_id_")

Roughly comparable to document.images is:

document.getElementsByTagName('img')

Now, this can be used via the div:

divObj.getElementsByTagName('img')["_image_id_"]

..but there's no point here.

MichaelBluejay

4:00 am on Nov 29, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Thanks very much for your help. I'm now able to reference my arrays with variables no problem. I still had some problems with image-swapping, but I've almost got it solved, as per below.

At first I still couldn't get the image swap to work on my Mac, in either IE5 or Safari. I'd click the link to swap the image, and I'd still see the original image. Interestingly though, when I clicked to swap, all the other elements on the page would move out of the way, to make room for the bigger image, although it was the original image that was displayed, not the new, bigger image.

I finally tracked the problem down to the fact that I had previously swapped the DIV containing the image into an <innerHTML> block. As soon as I tried the DIV in its original location it worked fine.

So that means I have to find another way to swap my DIVs into the correct place on demand. I guess I'll change the <style="display: none¦block; position:..."> of the DIVs, but the problem there is that the DIVs are of various sizes, so I don't know how to make room for the footer of the page. This is why I wanted to use <innerHTML>, because it moves everything around properly to get out of the swapped DIV's way.

Vertically, my page is:

A (header)
B (DIVs swapped in dynamically)
C (footer)

But I guess how to get the footer to move up and down properly is a question for the CSS forum, so I'll post about this there.

Thanks again for your help. WebmasterWorld is awesome as a technical support resource. I tried to help some other people today in the forums so I'd give something back. Thanks again.