Preventing default context menu on longpress / longclick in mobile Safari (iPad / iPhone)
Thanks to JDandChips for pointing me to the solution. It works perfectly in combination with the longclick plugin. For documentation sake I'll post my own answer to show what I did.
HTML:
<script type="text/javascript" src="https://raw.github.com/pisi/Longclick/master/jquery.longclick-min.js"></script><p><a href="http://www.google.com/">Longclick me!</a></p>
The Javascript already was OK:
function longClickHandler(e){ e.preventDefault(); $("body").append("<p>You longclicked. Nice!</p>");}$("p a").longclick(250, longClickHandler);
The fix was to add these rules to the style sheet:
body { -webkit-touch-callout: none !important; }a { -webkit-user-select: none !important; }
<style type="text/css">*:not(input):not(textarea) { -webkit-user-select: none; /* disable selection/Copy of UIWebView */ -webkit-touch-callout: none; /* disable the IOS popup when long-press on a link */} </style>
If you want disable only anchor button tag use this:
a { -webkit-user-select: none; /* disable selection/Copy of UIWebView */ -webkit-touch-callout: none; /* disable the IOS popup when long-press on a link */}
A quick css solution:
html { -webkit-user-select: none; -webkit-touch-callout: none;}
user-select disables highlighting text/areas.
touch-callout disables context menu popup.