Possible Duplicate:
Can I disable a CSS :hover effect via JavaScript?
I have a dropdown menu which works fine using the css .hover pseudoclass. It works fine on both desktops and tablets. On tablets, the hover effect is triggered when the menu is clicked. Presumably the tablet manufacturers have done this to make them compatible with this sort of menu.
The menu is pure CSS/HTML and requires no javascript to work.
However, I want to add swipe functionality, so that you can swipe left or right on an open menu, and it will move to the next option, without you having to click on the top menu. Unfortunately, programatically controlling the menus is clashing with the tablet's hover functionality. IE, the new menu is appearing, but the old menu isn't disappearing because the tablet browser is still treating it as an active hover.
So, what I want to be able to do is use jquery to disable the css :hover definitions. Once I have done that I will be able to implement a jquery tablet solution, while leaving the existing code intact.
I know I could do this by using different CSS files for tablets and desktops, but I was wondering if there was a neater solution that could be done using jquery.