Home/ Questions/Q 8526799
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-11T08:22:35+00:00

I have created a menu , with 3 tiers. The problem occurs after clicking

  • 0

I have created a menu, with 3 tiers.

The problem occurs after clicking the top-level items. What you will notice is that there is a LI:Hover pseudo class on the top items which highlights them grey when you hover over them. If you click on one of these top items, then wait for 2 seconds off the menu area, it will revert back to the current page’s menu item.

Here is where the problem occurs. If you now hover over the top menu item you just clicked, its pseudo hover seems to have disappeared, or become disabled.

I am not sure if this is a jQuery/Javascript error on my part or a CSS mistake.

Any help would be great!

Thanks, Devin

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    After the animation has run the <li> ends up in the following state

    <li style="background-color: transparent; background-position-y: 24px;">

    with the inline background-color which overrides the CSS rule

    #navigation li:hover, .active { background-color: #888888; }

    Changing the revert() method from $curMenuTop.css('backgroundColor', 'transparent'); to $curMenuTop.css('backgroundColor', ''); should fix the problem as it removes the backgroundColor, rather than setting it to transparent and allows :hover to still win where necessary.

    • 0