Hover effect

[maxpayne600]

Hi,

I have a little problem,

I was wondering if it's possible to use CSS/Javascript to adopt the :hover selector somehow. What I want is the ability for :hover to change the style when the mouse hovers over it, though when the mouse moves away from the text, the style remains the same rather than reverting back to its previous style (until another link in the same layer is hovered over).

Also, it must work independently of different layers, i.e. :hover function of another layer shouldn't affect it.
Is this possible?

[djr33]

What are you wanting to effect, exactly?

From what i've seen, hover only relates to text, and, maybe only links.

for example:
a {text-size="1";}
a.hover {text-size="2";}

[Twey]

djr33: That's some seriously malformed CSS.
maxpayne600: I think you'd be better off going with a pure Javascript approach here. The biggest problem will be your use of layers. Layers were a proprietary Netscape feature, and are quite obsolete in modern HTML.

[djr33]

Yeah, I'm really tired right now... my eyes are barely open.
My point... that controls the links on the page... small, then a bit bigger when hovered over. The numbers are off too.
But.... just an example of what it can do, not how to do it. Too tired to look it up. Sorry

Ah, and "change the style when the mouse hovers over it"... nevermind. Missed that before.


As for javascript, could you control the stylesheet through JS?
something like:
<something onMouseover="document.css='css.css';">
that would be easy to switch out as much as you wanted.

Not sure if the css can be replaced without reloading, though.

Just save two copies of the css that are identical, and change the things you want to change. Remember, you wouldn't have anything left over from the original formatting, so the second .css file would need to include all formatting you need to keep for consistancy, etc.

[Twey]

You can replace it, but it would be a document-wide change.

[djr33]

Indeed.

Replacing style sheets.... that's the point, right?

Plus, not too hard to save a duplicate, then just change that one section you need to change.

Can you have multiple stylesheets in a page and/or some included in the html and the rest in an external file?
You could have the changing parts be external and rotate them, then have the rest of the css internal.
this may be against the standards of html, though.

[Twey]

No. The point is to replace the style of a single link, not the whole document.

You can do what you say, but it won't achieve the effect the OP desires.

[maxpayne600]

Just to clarify,

The effect I'm looking for is the ability for the hover effect of a link to remain until another link is hovered over, rather than reverting back to the original style when the user moves the cursor away from the link.

Any ideas?

[Twey]

I reiterate:

you'd be better off going with a pure Javascript approach here. The biggest problem will be your use of layers. Layers were a proprietary Netscape feature, and are quite obsolete in modern HTML.

[djr33]

Ah, I thought it was more of a system wide thing. A mouseover effect would do what you want, except for reverting back to the original state afterwards. Now I understand the problem.

I think twey is basically saying do a mouseover, but don't use onMouseout. Just onMouseover. That way, it'll switch, but not revert when you stop hovering.