Raphael drag clone onDragOver - raphael

Question

Currently I drag a clone of a draggable Raphael element by using element.clone() in the dragStart function and moving the clone in the dragMove function (removing it in the dragStop function).
This raises an issue with the onDragOver function for the draggable element since most of the time the clone throws the corresponding event instead of the targeted one.
Some code:
dragStart = function() {
var s = this, c = s.clone();
s.data('clone', c);
c.ox = c.attr('cx');
c.oy = c.attr('cy');
};
dragMove = function(dx, dy) {
var s = this, c = s.data('clone');
c.attr({cx:c.ox+dx, cy:c.oy+dy});
};
dragStop = function() {
this.data('clone').remove();
};
onDragOver = function(el) {
console.log(el); // displays most of the time the clone
};
elementToDrag.drag(dragMove, dragStart, dragStop);
elementToDrag.onDragOver(onDragOver);

Answer 1

After sleeping a night over it I changed the approach of the clone itself by dragging the original and set a clone at its position. Thus I keep the original position and the onDragOver function shows the correct target element.
dragStart = function() {
var s = this, c = s.clone(); // clone stays at the original position
s.data('clone', c);
s.ox = s.attr('cx');
s.oy = s.attr('cy');
};
dragMove = function(dx, dy) {
var s = this;
s.attr({cx:s.ox+dx, cy:s.oy+dy}); // but now the original is being dragged
};
dragStop = function() {
var c = this.data('clone');
this.attr({cx: c.attr('cx'), cy: c.attr('cy')}); // put original at the position of the clone
this.data('clone').remove(); // and remove the clone
};
onDragOver = function(el) {
console.log(el); // now only the targeted element is shown
};
elementToDrag.drag(dragMove, dragStart, dragStop);
elementToDrag.onDragOver(onDragOver);