Here is the menu I am working with:
<ul id="menu">
<li><a href="#" id="test">test</a></li>
<li><a href="#" id="test2">test2</a></li>
</ul>
Along with the following CSS:
#menu li a:link {
background: transparent;
}
#menu li a:hover {
background-color: red;
}
At one point in my code, I need to reset the background of the links to transparent. So, I use this jQuery snippet:
$("#menu > li > a:link").css("background","transparent");
However, after doing this, it seems to remove the hover effect from the links. Despite adding color: blue to the #menu li a:hover CSS, the background color does not show up on hover.
I found a workaround using jQuery for the hover effect, but I would prefer to stick to CSS for this. Is this a bug? Is there a way to make the background transparent without affecting the hover CSS?
Thank you,
Nolhian