Mouse Over Action on Background Image

[Phoenix_307]

I have a background image and I would like to be able to mouseover (or some other command) certain parts of the image and have text in the right hand column change color when the mouse crosses specified co-ordinates. Is this possible in CSS/HTML?

[Wickham]

There are several techniques that might do part of what you want, but whether you can combine them or find a script that already combines them I don't know.

CSS Hoverpopups http://www.wickham43.net/hoverpopups.php can create a text panel positioned somewhere on the page using only CSS and you may be able to position the link over an image but I don't think it will be an invisible hover link.

You could use javascript or jquery for the text tooltip popup on the right. Google jquery tooltip, like this:-
http://flowplayer.org/tools/tooltip/index.html

The hover over the background image can be done with only css with two methods:-

The first method is an image map. They aren't used a lot, but work well; often used over a map of a country with links over each city, or over a photo of people with links for each person.
http://www.wickham43.net/imagemaps.php

The same effect can be done with a div or list (item 2 in link above) but I found that it needed a transparent image or the background image disappeared where the link is.

For a totally CSS solution try combining a hoverpopups with an image map but you probably will find a jquery solution for all you want.