Imagemap highlighting ...

[dbrb2]

I have made a virtual tour of my college at:

http://www.fitz.cam.ac.uk/users/dbrb2

You can navigate either by clicking the panorama, or by clicking the map. The problm is, if you don't already know your way around the college, it is easy to loose track of where you are. I've been trying to find a way of highlighting the currently clicked area on the image map. I though of splitting the image, but its a really complicated map, so not sure how I could do that. The other option is to load a different entire image for each location, but that is sloooow. Any ideas would be greatly appreciated ....


Ben

 

[vongrunt]

As far as I know, AREA tag has no CSS attributes or DHTML filters to work with.

You can use different transparent image for each highlighted location + CSS positioning + z-index.

VML perhaps (IE-only), but personally I wouldn't do that.

Btw. GIF format is better for this background map image.

 

[grtfercho]

Here's a simple idea/
USe Javascript mouse effects.

Just grab a script from the net.
This would work

http://www.javascriptkit.com/script/script2/simpleimagetrail.shtml

and modify it in a way that once you click on something the little image stays there (kinda a -you are here- sign.You could create a small .GIF animation even.

You will have a problem if the user clicks anywhere outside your map, then the -You are here- graphic will move also. To correct that just make sure that the (X,Y) coordinates of the cursor are within the coordinates of the map.
You could also trigger the 'You Are Here' graphic only when the onclick event triggers on the image map.

You still get the visuals and once the javascript is cached (plus that small graphic) the users won't see any kind of disruption. It'll be super fast.


just an idea.
hope it works out for you.

grtfercho çB^]\..
"Imagination is more important than Knowledge" A. Einstein
-----------------------------------------------

http://www.llajta.com