Draggable#updateDrag
Hey,
I've been trying to implement a drag-drop interface where a marker pops-up when a draggable is hovered over a droppable. The position of the marker (before / after) is determined based on the overlap between a draggable and the droppable it is hovered over. I am using the onHover callback of the droppable which seems to pass the overlap relative to the mouse pointer and not the bounding box.
A little investigation brought me to Draggable#updateDrag which is one of the method used while calculating the overlap; here the pointer values returned are:
var pointer = [Event.pointerX(event), Event.pointerY(event)];
which are the mouse pointer values and not the coordinates of the bounding box. Shouldn't the bounding box coordinates be used to calculate the overlap or am I missing something?
Thanks
First of all, my English sucks. Second I watch this problem when tried to drag an element (div) which is inside another div (overflow: auto). The problem: div box was not centered respect the pointer. The problem lead me to Draggable#updateDrag and I resolved appending some extra calculations to match the correct position of the box in the document. The solution looks like var pointer = [Event.pointerX(event), Event.pointerY(event)]; var vpos = this.element.viewportOffset(); var sos = document.viewport.getScrollOffsets(); this.offset = [0,1].map( function(i) { return (pointer[i] - (vpos[i]) - sos[i]) }); So far woks very good but I don´t feel pleased having a modified version of dragdrop.js.