IE6 image swap onClick problem

I have a very simple javascript function that swaps 6 images to either 'on' or 'off' jpg's based on user onMouseOver. Everything works frine on all browsers. Then I changed all the onMouseOver's to onClick's. And, everything works fine everywhere EXCEPT on IE6 (all 6 images disappear on-click of any image). The very simpe javascript looks like this:

function switchImage6(which)

{
if (which==0){
myElement = document.getElementById("pane6"); myElement.src = "/virtual/assets/guideIcons/guideOff.jpg";
myElement = document.getElementById("pane7"); myElement.src = "/virtual/assets/guideIcons/whenOff.jpg";
myElement = document.getElementById("pane8"); myElement.src = "/virtual/assets/guideIcons/whereOff.jpg";
myElement = document.getElementById("pane9"); myElement.src = "/virtual/assets/guideIcons/whatOff.jpg";
myElement = document.getElementById("pane10"); myElement.src = "/virtual/assets/guideIcons/howOff.jpg";
myElement = document.getElementById("pane11"); myElement.src = "/virtual/assets/guideIcons/whyOff.jpg";
}

if (which==6){
myElement = document.getElementById("pane6"); myElement.src = "/virtual/assets/guideIcons/guideOn.jpg";
myElement = document.getElementById("pane7"); myElement.src = "/virtual/assets/guideIcons/whenOff.jpg";
myElement = document.getElementById("pane8"); myElement.src = "/virtual/assets/guideIcons/whereOff.jpg";
myElement = document.getElementById("pane9"); myElement.src = "/virtual/assets/guideIcons/whatOff.jpg";
myElement = document.getElementById("pane10"); myElement.src = "/virtual/assets/guideIcons/howOff.jpg";
myElement = document.getElementById("pane11"); myElement.src = "/virtual/assets/guideIcons/whyOff.jpg";
}
// and so forth through... if(which==11)

Hopfully, the solution is obvious to a savvy javascript programmer; of which I'm not (evidenced above).

Any help would be greatly appreciated. Thank you!

 

Can you post the HTML too..atleast an example of one of your onclicks. Or link to your site..could be the way it is resolving the relative path...though I can't see why and onmouseover and onclick would be different. Also if you put a height and width on an image, when it disappears it should show a red x...you can right click on the red x and view properties which will show you the location of the image that it cant find.

 

Thanks so much for being willing to take a look at this, mjamesb.

I put up 2 test pages:

1: http://www.vegasrooms.com/test1.html ...employs onClick

2: http://www.vegasrooms.com/test2.html ...employs onMouseOver

Otherwise both files are identicle.

Thanks again, mjamesb!

 

That is very strange...why IE handles them differently I don't know. If I right click on one of the images and view properties....grab the url and paste it into the browser it shows the image...if I then go back to the page it will then show the red image when I click on it. Are you pre-loading any of the images?

Just a tip....rather that putting your images inside an anchor and using javascript:void just put the onclick on the img and use a style to get the hand cursor; maybe that would make a difference...

<img src="xx.jpg" onclick="func();func2();" style="cursorointer;">

that is cursor: pointer

 

Thanks mjamesb, I'm not pre-loading images. I'll try the style approach, and see what happend.

Thanks again

 

p.s. I works fine in FF and IE7...sorry I couldn't be more help...

 

Your approach fixed it mjamesb.

Although I have no clue why, and why only IE6, at this point I'm just glad to have a solution. (.../test3.html)

you ROCK mjamesb! Thanks so much!!

 

no problem...give me a positive reputation...it is negative because a bunch of people racked on my avatar...I won't take it down! Not even sure how to give someone reputation but if I go to my CP link i see a bunch people put on me...but that was a couple years ago...now people know I was right.

Good luck with your site.