RFE: Add touch-callout

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?

Received on Friday, 13 June 2014 12:26:18 UTC