[RESOLVED] Javascript roll-over img & tab

Yari

Hello,

I have a simple javascript roll-over effect for a large img on a clients website. Sample is here:
http://www.phoenixdigital.com.au/rollover2/

What I'd like is when the main img changes, to keep the small yellow tab highlighted (at bottom of img)... how on earth would I go about this?

Also, how would I go about putting in a 'loading' message while the main image loads?

Thank you for any suggestions.

JPnyc

I'm not sure what you mean since none of the links do anything when I click on them. I can't see what the functionality is.

dougal85

onmouseover you need to give it the 'on' class
onmouseout you need to remove the 'on' class

function changeme(this){

this.className = "on";

}

Thats a simple examples of how to set the class when you click an element. If you need help taking that further let me know.

As for a loading Image... why not just preload the images in the background?

Otherwise you could set the div to have a loading message as the content and when the mouse over happens start a function that loads the image and then inserts it into the div.

dougal85

ie.

var x = new Image();
x.src = "path to image";
// this is not loading in the background, now just set the div's inner html to this image and that will clear the loading.

Yari

Thanks dougal85, you hit the nail on the head first time!