使用3D Touch防止在较新的iPad上拖动图像和链接

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了使用3D Touch防止在较新的iPad上拖动图像和链接相关的知识,希望对你有一定的参考价值。

我正在实施按住并按住以拖动网页的元素表。

由于androidios上的各种长按菜单以及跨浏览器触摸功能的差异,此功能非常困难。

我有块项目,基本上是包含图像和链接的div标签。父块项需要是可拖动的。

不幸的是,在较新的iPad上,safari允许您拖动任何网页上的任何图像或链接。这会让我的拖放变得混乱,因为它会开始拖动父块,然后块内的图像会分开并自行拖动。

从其他堆栈溢出帖子,建议使用以下CSS。我已将它应用于所有子元素,链接和图像,但图像和链接仍然分开,并且可以在较新的ipads上自行拖放。

如何通过3D触摸防止新版iPad上的图像和链接长按拖放?

.drag-parent-wrapper * {
    @include user-select(none);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    -webkit-touch-callout: none;
    -ms-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

没有这个工作。我已经验证它可以递归地应用于所有在新的ipads上仍然可拖动的子img和链接元素。

我默认情况下无法阻止任何触摸或鼠标事件,或者我的功能在整个设备板上都存在风险。

答案

简单如下:

img draggable =“false”src =“image.png”alt =“图像描述”

从:

http://www.denisbouquet.com/css-forbid-selection-user-select-dragging-ghost-image/

以上是关于使用3D Touch防止在较新的iPad上拖动图像和链接的主要内容,如果未能解决你的问题,请参考以下文章

图像未在 iPad Air、iPad 3 等较新的 iPad 设备上显示,但在模拟器 iOS 8.1 上显示

为啥在较新的 Android 设备上预检失败,但在较旧的设备和台式机上却没有?

在 android 中获取位置无法在较新的设备上运行

使用 rc.status 的 Bash 脚本在较新的 SLES 上执行两次

在较新的 PHP 版本中使用具有相同 CSS 选择器名称的 PHP 变量时出现问题

使用 touch.tapCount 确定按钮上的长按