Click to See Complete Forum and Search --> : help with setting mouse pointer display on image map


obscure
06-27-2003, 11:12 AM
hi all.

I am new to this site although I've read plenty of the posts on here over the past year or so as the replies have often answered questions I myself was going to raise. but in this case I cannot find the solution to my problem.

Basically I've written a script to swap over two images and their associated image maps when a different image hotspot is clicked on (are you following me?). The problem is that whilst that works fine (in the browsers I've tested in so far anyway - please lmk if you find otherwise) the mouse pointer is an arrow when hovering over this link rather than a 'hand' which is what I need it to be like all the other links.

The site has been temporarily uploaded to this location:
http://www.51pegasus.co.uk/mums4/newversion/about.htm
(still work in progress so please be gentle!) so you can see what I am referring to.

The first 5 navigation points are in one image and the others are in a second (that gets swapped with a 3rd when the last link in the top navigation - food concerns - is clicked).

Would really appreciate any help on working this out!

Cheers all :)
Sadie

Exuro
06-27-2003, 11:52 AM
Well, it took be a little while but I think I finally got it. Unfortunately, the <AREA> tags don't seem to like the style="" attribute, so I couldn't do the easy way and just say style="cursor:hand" like I tried origonally. Instead I used the onMouseOver and onMouseOut event handlers to change the pointer back and forth as the cursor moves over and off of the Food Concerns image. Here's the two sections of code I edited:

( line 48: )
... <img id=topMenu src="nav1.gif" width="190"
height="157" border="0" usemap="#Map"> ...
( line 92: )
<area shape="rect" coords="45,128,180,153" onClick="swapMenu();"
onMouseOver="document.images['topMenu'].style.cursor='hand'"
onMouseOut="document.images['topMenu'].style.cursor='auto'">

I hope that fixed your problem!

obscure
06-27-2003, 12:07 PM
You're a star!

I too tried and failed with the seemingly easy option of the style="cursor:hand", I should have thought to put it in the mouseOver event handlers.

Thanks so much for your help :)

Sadie