1

I am trying to make a solution for yoga laptops(the ones that support both, click and touch). I have multilevel navigation where submenus are displayed on hover, however on these laptops you can touch/tap menu and I get click event which loads link set on top menu item that is clicked and does not display submenus. If I try to recognize if touch is supported using modernizr and preventDefault on clikc - on some standart(mouse controled) laptops it creates this bug that top level navigation item becomes unclickable.

So what I am looking for is to write function that would execute preventDefault only on tap/touch and not click. I have this code to prevent default, but it seems to be ignored by touch and still acts up like click on these yoga laptops:

$(".multi-level .inner-link").on("tap",function (e) {
            event.stopPropagation();                  
            e.preventDefault ? e.preventDefault() : event.returnValue = false;
});

Any suggestions or links would be big help.

Mindaugas
  • 1,173
  • 5
  • 15
  • 31
  • 2
    There is no `tap` event. Try `touchstart` or `touchend`. Though, you should really consider changing your design so there is no functional dependency on hover events. – Tom Pietrosanti Aug 26 '15 at 13:03
  • @TomPietrosanti - +1 for the suggestion to remove functional reliance on hover events. – enhzflep Aug 26 '15 at 13:05
  • If this would be my design and my power to decide - I would. Thank you for the suggestion. :) – Mindaugas Aug 26 '15 at 14:46
  • 1
    @MindaugasJačionis Refer this http://stackoverflow.com/questions/7018919/how-to-bind-touchstart-and-click-events-but-not-respond-to-both This may help you to solve your problem. – John R Aug 26 '15 at 15:29

0 Answers0