Change Color Upon Hover

[Lincoln]

Is there an easy way to set certain text on a page to be one color, and another color when you hover over it? Right now, I'm just using a link code where I make false links out of the text I want to change colors, and they change to the color I want when hovering over them. It works exactly the same, but I don't want links going nowhere on my page.

[jscheuer1]

Unfortunately, in IE there isn't. Since it is the most widely used browser, even though other modern browsers support the pseudo-class :hover on most elements, this strategy is virtually useless as, IE only supports it with links.

You can use javascript to disable the links and use something innocuous for the link so that even if it is clicked in a non-javascript enabled browser, nothing bad will happen. Something like so will work well in most browsers:

<a href="javascript:void();" onclick="return false">Text Here</a>

You can give the tag(s) a class and only apply your hover effect to that class so that real links can use their own set or default hover behavior:

<a class="hEffect" href="javascript:void();" onclick="return false">Text Here</a>

Then in your stylesheet:

.hEffect {
cursor:text;
color:black;
text-decoration:none;
}

.hEffect:hover {
color:red;
}