停止Chrome的点击并按住/拖动图片默认行为

Question

我注意到在谷歌浏览器中，可以点击并按住图像，同时保持该图像的半透明副本会附加光标。然后可以将该图像拖到桌面上进行保存。

我想阻止和停止图片的半透明版本，将其自身附加到我站点中某些图像的光标上。

我该怎么做？

Answer 1

您可以使用属性

来阻止此行为

-webkit-user-drag: auto | element | none;

请参阅-webkit-user-drag CSS-infos.net的文档（如果有人有更好的参考，我没有找到MDN文档）

---

如何使用

在.nonDraggableImage代码上添加img课程，然后添加您的CSS：

.nonDraggableImage{
    -webkit-user-drag: none;
}

Answer 2

另一种方法是在要防止查看的图片顶部创建透明图片。

请参阅： http://www.dwuser.com/education/content/stop-the-thieves-strategies-to-protect-your-images/

在“欺骗下载者”下查看

Answer 3

我不得不使用不同的解决方案来实现它：

<img src="http://placehold.it/150x150" draggable="false">

谢谢：https://stackoverflow.com/a/7439078/2443005