23

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

我想防止和停止图像的半透明版本附加到我网站中某些图像的光标上。

我怎样才能做到这一点？

4

4 回答 4

50

您可以通过使用该属性来防止这种行为

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

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

如何使用

在您的标签上添加一个.nonDraggableImage类，并添加您的 CSS ：img

.nonDraggableImage{
    -webkit-user-drag: none;
}
于 2013-04-29T16:02:23.180 回答
3

我不得不使用不同的解决方案来让它工作：

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

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

于 2017-10-11T04:57:59.090 回答
2

另一种方法是在要阻止查看的图片上方创建透明图片。

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

检查“欺骗下载者”下

于 2013-04-29T16:05:34.690 回答
0

我喜欢用 - 可拖动

可拖动=“假”

<img draggable="false" src="image.jpg">

但你可以试试 - ondragstart

ondragstart="返回假；"

<img ondragstart="return false;" src="image.jpg">

或 - 指针事件（某些浏览器不支持并且还有其他问题）

样式=“指针事件：无；”

<img src="image.jpg" style="pointer-events: none;">
于 2021-11-30T06:35:39.747 回答