如何禁用拖动html元素(尤其是“img”)?

时间:2010-11-16 12:09:50

标签: html css dom

我有一个图像,我不希望它可拖动或可选择,以便不拖动到页面上的其他位置。怎么做的?

7 个答案:

答案 0 :(得分:3)

如果您希望访问者/用户看到您网页上的资源,则没有方法可以阻止他们下载或保存。

可能的选择:

  1. 您可以使用JavaScript来阻止右键单击上下文菜单(相关文章:http://javascript.about.com/library/blnoright.htm)。
  2. 您可以使用透明的.png.gif覆盖图片,以便点击图片简单返回透明图片。
  3. 但是,如果用户可以在网页上看到图像,那么已经在他们的计算机上

答案 1 :(得分:1)

实际上这比你想象的要困难得多,我认为你不希望人们偷你的图像这是一个公平的事情,但只记得有人可以从中获取图像的所有不同方式网站。您可以捕获右键单击事件并至少停止它们,但他们总是可以截取屏幕截图并保存。这是一个滑坡,它总是以同样的方式结束,如果他们真的想偷它,他们就会去。

答案 2 :(得分:1)

由于图像只是二进制数据,并且所有数据都写在客户端PC上,因此显示原因取决于用户对数据的处理方式。您无法阻止他们保存网站上显示的图片。

你可能做的就是通过阻止右键单击图像,(右键单击显示警报或类似的东西)使其变得更难一点。但如果用户真的想要保存图片,他们无论如何都会这样做。

答案 3 :(得分:1)

你为什么要这样做?

我可以建议一个能够实现的JavaScript:http://www.brownielocks.com/stopcopying.html

但是,即使经验不足,每个人都可以查看来源并复制它。即使你阻止他们查看来源,他们也可以使用wireshark并直接获取图片。即使您使用闪光灯显示图片,也可以屏幕截图并检索图片。

在图片上添加水印并不时使用http://www.tineye.com/并搜索您的图片。如果你发现其他人使用你的照片 - 起诉他们。这是最有效的方式。

答案 4 :(得分:0)

您无法阻止用户将某些内容从网络保存到他的PC。我想到的最近的事情是-moz-user-select CSS属性...... https://developer.mozilla.org/en/CSS/-moz-user-select

答案 5 :(得分:0)

不可能像其他人已经提到的那样阻止某人在他们的计算机上存储图像(或其他资源)。

但另一个让它变得更难的技巧(我认为没有经验的人是不可能的)是使用CSS和背景图像:

<div style='background: url("myimage.gif");'></div>

图片现在位于<div>块的背景上,无法拖动或右键单击以保存它。

使用一些编码知识,可以显示myimage.gif部分,可以在基本URL之后添加,以便下载图像并保存。例如,如果HTML页面位于http://www.example.com/mypage.html,则可以在http://www.example.com/myimage.gif

找到该图像

正如我所提到的,仍然可以保存图像,但对于没有经验的人来说,这要困难得多。

注意:在这个示例中,图像只是放在HTML标记中,但如果正确使用CSS文件,找不到经验丰富的人就更难了。

答案 6 :(得分:0)

这个javascript片段完全符合OP的要求:

document.addEventListener("dragstart", preventDrag);
function preventDrag(event) {
    event.preventDefault();
}