0

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.

Improve this question
3
  • 1
    Possible duplicate: Can I disable a CSS :hover effect via JavaScript? Commented Feb 2, 2013 at 12:46
  • I will check that link out. Thanks. I did a search but I din't find that article. Commented Feb 2, 2013 at 12:49
  • 1
    Yes, that solution provided works fine. It is a thing of beauty. Commented Feb 2, 2013 at 16:17

1 Answer 1

Reset to default
1

You can "play" with the CSS classes your element has with jQuery removeClass and jQuery addClass.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

That doesn't work with psuedoclasses. I should have said :hover in the question title, instead of .hover.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.