Help with jQuery Menu not working on Touch Devices

[wrack]

Hi,

I am in the process of redesigning my site http://www.codelake.com

The navigation menu is done using jQuery script from here http://tympanus.net/codrops/2010/11/25/overlay-effect-menu/

I have added a bind for click event apart from the usual mouse enter and mouse leave but for some reasons, when I test it on touch devices (which do not have hover per say), I have to click twice in order to get the menu to appear. I can't find out why and any help would be greatly appreciated.

Cheers :)

[threetonesun]

It's because they do have a hover, sort of. I imagine if you logged it you'd see one click getting the hover off and click at the same time.

FWIW, you might want to reconsider that menu design, it doesn't work for desktops very well either. If someone clicks on the menu, it pops open then closes... it's a bit counter intuitive.

[wrack]

Thanks for the suggestion.

What can I do to make it work on both the desktop and mobile then with the current menu design? I quite like that design but happy to change if nothing else work.

Edit: I have removed the click bind for the time being. Will consider redesign of the menu in the meantime.

In the meantime any fix that would save me the time to redesign the whole thing would be appreciated :)

Edited January 17, 2013 by wrack