Javascript Dnd阿凡达：如何在dragOver上获得所见即所得预览？

我们收到一位客户的请求，要求支持以下场景：

• 在一个页面上，我们有一个容器：

  div

  元素，它同时是

  dojo.dnd.Source

• 容器中有9个类似内容的

  div

  元素：2个按钮和2个组合框

• 用户只需在容器中拖动这9个

  div

  元素，就可以定义它们的顺序

任务是在拖动时显示可能的布局预览

---

如果您有任何想法，我将不胜感激。

请关注您的评论和首次尝试此解决方案，我谦恭地提出以下建议：

如果正在设置动画并对鼠标指针的更改敏感，则应将两者分开：

• 将元素与拖放事件订阅（父级）单独保留。永远不要改变它的外观
• 在此元素内创建一个元素（子元素），该元素将设置动画，但不会影响其父元素
• 父级可以是透明的

---

这能帮上忙吗？

最简单的方法就是走纯CSS的路。Dojo设置dojoDndItemOver类，因此其想法是更改div.dojoDndItemOver的宽度并设置填充。部分工作：偶尔按预期工作，但偶尔眨眼/跳得很厉害。此外，在这种方法中，很难排除div.dojoDndItemAnchor元素。我甚至不确定我走对了谢谢你，乔纳斯。目前，我们坚持使用基于CSS的解决方案。