How do I change the textcolors of menu-items on hover?

[havokian]

Hi all,

I need to change the textcolor of the menu-items in the standard CSS menu when hovered. Preferably not only when the cursor moves over the text itself, but also when it moves over the box where the text is in. Can someone help me with this one?

Thanx in forward

[havokian]

You can find it here: http://www.havok.nl/cmsms/

As you can see the text-colors only change when you hover over the text itself. I'd like the text-color to change simulatiously with the backgroundcolor of the menu-itembox. Basically just like with the second-level menu-items... I don't know why it does work there.

[westis]

Hi havokian,

You can't have the text color changed hover, except for the actual menu item that is hovered. That is, only one item link is hovered at the same time. However, you can change the background color because that is not in the link/anchor, but in the li (list item) that is hovered.

Sorry if that explanation is a bit confusing, my CSS is a bit rusty after three weeks in Kenya... The point is that the link color on hover can only be changed on the menu item that is currently hovered, not for example on the menu item on the first level when the second level is hovered.

[Mamphil]

Hi!

I tried this code at the end of your CSS:

Code: Select all

ul#primary-nav li.menuparent:hover a {
color: #fff;
}

Unfortunateley all anchors (links) in the hovered menu turn white if you hover one single list item. If you want to edit the php code of the module, you could add a class attribute to the first -tag:

Bob's pagina

Sprekershoek
Songs

Then this CSS would work:

Code: Select all

ul#primary-nav li.menuparent:hover a.menuparent {
color: #fff;
}

Mamphil

edit: At least this workaround works in Firefox, for IE the JavaScript would have to be edited