Hi all,

So I want to take a picture of the United Kingdom, and have the different parts glow when you hover over them, then click through to different pages.

The obvious way to me would be to have a div with a background image of the UK, which changes to an identical pic but with Scotland glowing a different colour (I have already made all the images etc) when you hover over a transparent png rectangle which is linked to 'Scotland.php' and positioned vaguely over Scotland.

Does this make sense so far?

I need it set up for 7 regions, so 7 links that change the background image of one div. (and said links need to be positioned within that div at awkward places)

Any ideas? I'm flat out at the moment - it's the last thing I need to do on a huge site project, and I can't think!

Any and all suggestions welcome. No working code at present.

Hi all,

So I want to take a picture of the United Kingdom, and have the different parts glow when you hover over them, then click through to different pages.

The obvious way to me would be to have a div with a background image of the UK, which changes to an identical pic but with Scotland glowing a different colour (I have already made all the images etc) when you hover over a transparent png rectangle which is linked to 'Scotland.php' and positioned vaguely over Scotland.

Does this make sense so far?

I need it set up for 7 regions, so 7 links that change the background image of one div. (and said links need to be positioned within that div at awkward places)

Any ideas? I'm flat out at the moment - it's the last thing I need to do on a huge site project, and I can't think!

Any and all suggestions welcome. No working code at present.


Image mapping would be best option for this. Following are the links for sample code:

http://htmlhelp.com/reference/html40/special/map.html

http://www.javascriptkit.com/howto/imagemap.shtml

http://www.htmlcodetutorial.com/images/images_famsupp_220.html

http://www.w3schools.com/TAGS/tag_map.asp

Or create a CSS image map (http://www.noobcube.com/tutorials/html-css/css-image-maps-a-beginners-guide-/).

Oooh nice! I'm liking both, to be honest. Will deliberate and then implement, link to follow.