Why doesn't hover in the menu work on iphone?

Question

iPhone

This menu does not work on iphone designmodo.com/demo/css3megamenu . Pressing does not open submenus.

There is a solution on the internet:

<script type="text/javascript">
    if ((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))) {
        $('.nav li a').click(function () {});
    }
</script>

I tried to prescribe this code before the html menu, it did not help. Maybe I'm doing something wrong?

Answer 1

But how do you imagine hovering over an element in touch devices?
is it when the finger hovered a millimeter from the screen above the element?))
In touch devices there are touchstart, touchend, touchcancel, touchleave, touchmove.
docs

Answer 2

Some incomplete solution was found on the Internet.
First, we need to add a class to the styles that will do the same thing as :hover. Secondly, on click (or better on ontouchend), remove this class from all nav li and add it where clicked.