creating an image rollover side by side

[Patail]

HI,

Actually i need someone's help with an image roll over. What i have done is -

I have an map of Australia with five red spots which indicates our regional offices. Now my manager wanted it in such a way that when you move your mouse over the redspot, you should see the image of the regional office as well.

So what i did was to split the image into 70 pieces so that each redspot becomes a seperate jpg file. Now i want to know how to create the image rollover. I cannot create a mouseover as each redspot is only about 10x10 pixels and the mouseover image would also become of the same size and it would not be visible at all.

What i want to know is whether we can create a script in such a way that when you bring the mouse over the redspot, it should also popup the regional office image along with its address on its side without altering the redspot.


Do you think that creating a layer at the specified spot would work out. Can layer be made to work like this.

Do you think this is possible. Or is there anyother way out. Any help would be appreciated.
Thanks

[Patail]

Hi Dave,

Thanks for responding to my question. But you have not answered mine. Lets go by ur example itself with the table you have created in ur website.

What i need is that- when you mouseover the text "MainFrame Computers", you get an alt message. But what i require is when you mouseover the text, just like the alt message, you should get the another image also popup alongside the Text message. Is that possible. I think you can do with layers. I think you have to hide the layers first and then ensure that it becomes visible when you mouseover the text. But am not sure.

I donot thinkt it would have been possible without splitting the Australia map in my case as like i said, there are five red dots in the Australia map indicating five regional offices. I wanted the regional office image to popup only when you go to the particial red dot. Lets say, if you go to Red Dot indicating Melbourne, then the melbourne regional Office should be visible. But the other red dots should also be there. That means the other part of the map should not be covered.

I am attaching the Australia map for ur reference. Have a look at it. This is an entire file which i had split up and used.

Thanks again for ur time and help.

[Stefan]

Patail, listen to Dave, you are looking for imagemaps for what you want to do.


You can read up about specifics about <map> here
http://www.w3.org/TR/html4/struct/objects.html#edef-MAP :)

[James L.]

Just to clarify, you don't exactly want to have a rollover effect where the red dot changes to the pic.... you WANT to have it so when over the red dot a pic appears, correct???

If that is so:

1) You do NOT need to slice the image! The only real reason to slice the image as you are describing is if you wanted certain portions of the image itself to change when mouse-over'd. That way you can swap out the original slice for the rollover image, then swap the original back in.

2) Set up an IMAGE MAP, as mentioned above, on your image of Australia with circular hot spots over each dot.

3) put an "onMouseOver" command into each hot spot link which displays the image of the area office you have. These could pop up within a separate window opened with JS or simply be invisible layers that have their visiblity attribute triggered by onMouseOver and onMouseOut.


...hope this helps!