HTML5 拖放以将 div 移动到屏幕上的任何位置？

Question

标题很容易理解。

我找到的所有演示都是将一个 div 放到某个位置。例如垃圾桶。我需要制作一个可以拖放到屏幕上任何位置的可拖动 div。

可以用 HTML5 做到这一点吗？如果不是我应该怎么做？

Answer 1

这真的很简单:

1. 在 dragstart 事件中计算用户点击可拖动元素的位置与左上角之间的偏移量
2. 确保 dragover 事件应用于整个文档，以便可以将元素拖放到任何地方
3. 在 drop 事件中，使用您通过放置的 clientX 和 clientY 计算出的偏移量来确定元素的放置位置

Here's one我 prepared earlier .对于奖励积分，您可以更新 dragover event 中元素的顶部和左侧位置。 , 如果您允许拖动的位不是需要移动的整个元素，这将很有用。