我正在开发一个元素，其中包含一些可拖动的内容。所有可拖动的图像都有透明部分并与其他内容重叠。
我在 JSFiddle 上设置了一个示例:Draggable Example
<body>
<p>The background is transparent, but if you grab ANYWHERE in the border you can drag the image around.</p>
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/e/e1/Jupiter_(transparent).png/484px-Jupiter_(transparent).png"></img>
</body>
img{
border: solid black 1px;
}
在示例中，您可以通过在图像边界内的任意位置按住鼠标左键来抓取图像，即使它们是透明的。在此示例中，我的目标是只有在您捕获木星行星的可见部分时才能拖动图像。
这在 html 中可能吗？
最佳答案
根据您在上面评论中的说明，在 canvas 元素中绘制图像可能是最简单的。您可以按照此 SO 帖子中的说明向 Canvas 添加可拖动性:Make image drawn on canvas draggable with JavaScript .并且您可以修改它以仅当非透明像素位于单击位置时才触发拖动标志。
关于javascript - 如何使图像的一部分不可拖动？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29586615/