Change font color on image hover over

I want to link text to an image on a nav. I’m wondering what is the best way to change the font color when hovering over the image or text?

I thought of doing a sprite, but I think its best to have the text as text and not an image.

If the image and text are a part of the link then use

a:hover, a:focus {color: #999999;}

substituting the colour you want to change it to for 999999.

If you want it to stay that colour when the mouse button or enter key is depressed then set it for a:active as well

Am the worlds slowest typist… and Stephen beat me to this… But on an added note: You can also make the images bg images to the <A> tags. OR target the container element ( most likely an LI ) .nav li:hover a{ color: myColor; } as long as the IMG and the A are contained within the LI , the text will change color, giving the appearance that the text changes color when the image is hovered over , even if the IMG tag is not part of the actual live link .

hope that helps.

You can use a sprite image AND text. It’s a technique called ‘image replacement’. Here is an example: http://www.pmob.co.uk/temp/navimagereplace.htm

Paul has other nice examples, but I’m mobile, so have a look for them via his home page.