禁用 ios h5页面中长按图片弹出的弹层

html-css014

禁用 ios h5页面中长按图片弹出的弹层,第1张

当在iOS上一直按住一个目标元素时,Safari会展示一个关于这个链接的callout信息。

解决方案:

-webkit-touch-callout 这个 CSS 属性禁用了默认的callout展示, callout是指当触摸并按住一个元素的时候出现的提示。

参考: https://developer.mozilla.org/zh-CN/docs/Web/CSS/-webkit-touch-callout

概述:

-webkit-touch-callout 是一个 不规范的属性( unsupported WebKit property ),它没有出现在 CSS 规范草案中。

当你触摸并按住触摸目标时候,禁止或显示系统默认菜单。在iOS上,当你触摸并按住触摸的目标,比如一个链接,Safari浏览器将显示链接有关的系统默认菜单。这个属性可以让你禁用系统默认菜单。

语法:

-webkit-touch-callout :behavior

默认值 :inherit

适用于 :链接元素比如新窗口打开,img元素比如保存图像等等

取值:

none:系统默认菜单被禁用

inherit:系统默认菜单不被禁用

* CSS3新增属性可能存在描述错误及变更,仅供参考,持续更新

兼容性:

iOS 2.0及更高版本的Safari浏览器可用

Android尚不明确