Detecting a drag position on an item

Question

I am creating a wysiwyg editor to create html emails. I want to be able to add line layouts to the editor by drag and drop.

If a row is dragging and dropping above a point and a half return point, I want to add a row to the drop target; and if it falls below half a point, I want to add a line after the target.

Is there any way to do this?

Answer 1

You can use getBoundingClientRect()to get the coordinates of the element when you click the mouse button and move just like that

element.onClick = function() {
    element.onmousemove = function() {
        var x1 = element.getBoundingClientRect().left,
            x2 = x1 + element.getBoundingClientRect().width,
            y1 = element.getBoundingClientRect().top,
            y2 = element.getBoundingClientRect().height;
    }
}

and now you can do whatever you want with these coordinates.