RE: RFE: Add touch-callout

On Fri, Jun 13, 2014 at 5:19 AM, Daniel Trebbien <dtrebbien@gmail.com> wrote:
>
> Hi,
>
> In mobile browsers, when the user touches and holds a link or <img>, a popup is shown containing options for the user.  For example, touching and holding an <img>, Mobile Safari, Chrome for Android, and Android WebView/AOSP Browser all display a "Save Image" option in this popup.  In certain cases, it makes sense to disable this popup, such as when an <img> is used in the design of a webpage.
>
> Mobile Safari supports a property, -webkit-touch-callout, that can be used to disable this popup:
> https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html#//apple_ref/doc/uid/TP30001266-_webkit_touch_callout

> .. and unlike other -webkit-prefixed properties, this is specific to Mobile Safari; I have tested and found that it is not supported by Android WebView or Chrome for Android.
>
> To disable the popup on Android, the current approach is to preventDefault() touch events on the element:  http://stackoverflow.com/questions/3413683/disabling-the-context-menu-on-long-taps-on-android

> However, this has the side-effect that a native touch scroll starting on the image will no longer work.
>
> Chrome 36+ will support the Pointer Events touch-action property:  https://code.google.com/p/chromium/issues/detail?id=258459

> I have tested Chrome 36 Beta for Android and found that touch-action:none does not disable the callout popup, and leads to the unwanted side-effect of breaking touch scrolling.
>
> I have not tested IE Mobile because I do not have access to a Windows Phone, but presumably the need for a touch-callout-equivalent is there, too, as people are asking for an equivalent to -webkit-touch-callout on Stack Overflow:  http://stackoverflow.com/questions/15012702/webkit-touch-callout-equivalent-for-ie

>
> It would be immensely useful if touch-callout were added to the Pointer Events spec.  Could this property be added?

IE does this for touch like it always has for mouse (in all browsers):

 window.addEventListener("contextmenu", function(e) { e.preventDefault(); });

Unless I'm missing something special about how touch-callout works, I think touch-callout is redundant in this regard (though I don't believe the contextmenu event is yet supported in other browsers for touch IIRC).

I'd prefer not to create a new API (and instead petition other browsers for interoperable contextmenu support, which is already standardized in HTML5) unless there's additional functionality and associated use cases that touch-callout provides.

-Jacob

Received on Friday, 13 June 2014 18:30:53 UTC