Topic: Turning off hover...

Just wondering here--after specifying a color for hover, is there any way to turn it off again.

For example: I have a hover color specified for the "a" element. But then I have a div class that I don't want to hover. Is there a way I can specify "no hover" for this class? What I've been doing is just setting the hover color for that div to the background color, but this smacks of "workaround." I'm wondering if there is a legitimate way to do this. Or maybe I'm approaching it the wrong way?

I found a way to do it that works in Mozilla, but I'm not sure about IE...

<style type="text/css">

a { color: red; }

body>a:hover { color: blue }

</style

This way only <a> tags with body as its parent will have the hover effect... if you have the <a> tag in a div or something else you can just switch 'body' whatever the other thing is.


_________________________
"I don't know half of you as well as I should like; and I like less than half of you half as well as you deserve" - Bilbo Baggins (S.R 1401)

Yep -

you have your regular links specified however you want.

for your div class, you do something like this -

.yourclass a:link, .yourclass a:active, .yourclass a:visited, .yourclass a:hover

{
your-styles:here;
}

Specifying the same styles for all the pseudo classes will give the hovered link the same style, essentially making it not hover.

{{edit - and of course, if the only style you wanted to change was that for hover, you would simply specify .yourclass a:hover and set your style accordingly. there is no actual 'hover ff;' kind of thing....}}

Hopefully that's what you meant?



[This message has been edited by DL-44 (edited 12-08-2002).]

V: The only problem with that option is that I want all my links to hover except for two classes.

DL: OK, I'm apparently having a record run of stupid here. When you say "specifying the same styles for all the pseudo classes," do you mean that I should give a:hover the same styles as the class itself? I'm a bit confused on that point.

Here's what I'm doing now:

.imagenav

	{

	margin-top: 1em;

	color: #66c;

	background-color: #000;

	text-align: center;

	font: 200% georgia, serif;

	font-weight: 600;

	text-indent: 0em;

	}



.imagenav a:hover

	{

	color: #f33;

	background-color:#000;

	}

So would I just put the styles for .imagenav into .imagenav a:hover? I have a feeling I'm getting this wrong here... and I also have the feeling that, while not technically correct, the way I've done it here may be the simplest way around this.

Whoa, hold on... I just got an idea. Let me go try this out.

Well, OK, that didn't work. I did change my a:hover styles, though:

.imagenav a:hover

	{

	color: inherit;

	background-color: transparent;

	}

Pretty much the same thing, but for some reason it seems more legitimate using "transparent." What do you think about this?

[This message has been edited by Suho1004 (edited 12-09-2002).]

pseudo class being the a:link, a:active, a:visited, a:hover

so it seems you may already have been doing what you need to do

basically just need to set the hover for your class to be like the non-hover. 'bout all there is to it. =)

Ah, OK. I guess I was just wondering if there was a simple way to turn hover off, but I guess there isn't. Thanks.

I suppose the other solution is to not set a global hover style in the first place.

___________________
Emps

FAQs: Emperor

Emps: You mean go into each and every class, except for the two in question, and set the hover there? No thanks. I think I'll just deal with imperfection.