将对象拖放到DIV ..相对于目标DIV的绝对位置和大小

Question

我有一个关于拖放的问题,并希望你们中的一个已经解决了它.我有一个在线网络应用程序,我可以在一个DIV上的图像上拖放注释(箭头,星星).

这里有一些事要知道.1)图像可以是任何尺寸(有时大有时小)2)包装的DIV可以左对齐或居中3)包装的DIV可以固定或自动

那么是否有任何可能的解决方案使它注释的位置总是相对于图像的左上角？所以

我正在使用jQuery.一旦我丢弃对象,我将如何获得注释的位置始终相对于图像的左上角？

谢谢!

Answer 1

尝试这样的事情.它为可拖动元素和可放置元素提供偏移量.通过一些数学运算,您可以获得相对于droppable左上角的可拖动元素的位置.

$('#droppable').droppable({
   drop: function(event, ui) {
      var thisOffset = $(this).offset()
      var x = ui.offset.left - thisOffset.left;
      var y = ui.offset.top - thisOffset.top;
      alert(x+','+y);
   }
});