Raphael - 拖放时检测重叠元素 [英] Raphael- Detect overlapped elements when drag and drop
问题描述
我正在尝试通过拖放另一个元素来获取元素.例如，我有 2 个圆圈:c1 和 c2.我想要做的是:如果我将 c2 放在 c1 上方，因此它们是重叠的(不是完全必要的)，我可以得到圆 c1(例如:id，title...等).
I'm trying to get element by drag and drop another element. I have for example 2 circles: c1 and c2. What i want to do is : if i drop c2 above c1 hence they are overlapped(not entirely necessary), i can get circle c1 (ex:id, title... etc).
http://jsfiddle.net/Tomen/LYjnV/1/
有办法吗?
推荐答案
我不确定你是想要碰撞的移动元素，还是碰撞的静态元素 - 所以我会同时提供.(听起来你想要静态的，但 Element.onDragOver 给出的是这个，正如 Oli 的评论中所建议的那样)
I'm not sure if you want the moving element that collides, or the static one that is collided with - so I'll give both. (it sounds like you want the static one, but it is this one which Element.onDragOver gives, as suggested in Oli's comment)
这是一个基本的jsfiddle，它访问两个元素:
Here is a rudimentary jsfiddle which accesses both elements:
- 对于碰撞的静态元素，它使用Raphael的Element.onDragOver
- 对于被拖动的移动元素，它使用了一些基本代码松散地基于 jQuery UI 的 Draggable 和 Droppable 库如何做到这一点，如此处所述 - 通过在拖动对象时将其放置在全局命名空间中，然后从那里访问它.
- For the static element that is collided with, it uses Raphael's Element.onDragOver
- For the moving element that is being dragged, it uses some basic code based loosely on how jQuery UI's Draggable and Droppable libraries do this, as described here - by placing the dragged object in the global namespace while it is being dragged, and then accessing it from there.
Raphael 可能已经有这样的功能来访问被拖动的元素，但如果有的话，我还没有设法在文档、代码或 DOM 中找到它.
It's possible Raphael already has a feature like this for accessing the dragged element, but if it does I haven't managed to find it looking in the docs, code or DOM.
我对第二点的实现是一个非常基本的演示，需要改进.对于更完整的东西，我建议阅读并从经过大量测试和改进的 jQuery UI 使用的代码中获取灵感来做同样的事情
My implementation of the second point is an extremely basic demonstration which would need improvement. For something more complete, I'd recommend reading and taking inspiration from the code used by the heavily tested and refined jQuery UI to do the same thing
这篇关于Raphael - 拖放时检测重叠元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
