The problem: http://themeforward.com/demo2/
When I hover over a menu item and begin to mouse down the sub-menu the parent link (i.e. "Templates") loses the properties attributed to it on-hover. I would like it to maintain these properties. I've tried numerous variations to achieve this and have been unable to do so. I assume this is achievable via CSS with Superfish and that I'm simply using the incorrect class.
My css: http://snippi.com/s/hv7m288
It's because the hover event is attached to the <a>
, but the submenu is a child of the <li>
. So adding a hover to the <li>
will fix it.
Here is a fiddle http://jsfiddle.net/7kYF6/
I changed this
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
color:#868E98!important;
background:#3C4751
}
to this and it worked for me
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active, .sf-menu li:hover a {
color:#868E98!important;
background:#3C4751
}