滚动容器时拖动元素会出错

Question

在这个Fiddle中，我使红色容器可以拖动。正如您所看到的，这工作正常但是当绿色容器（父容器）稍微滚动然后拖动红色容器时，拖动不会发生在正确的位置。

有人可以告诉我可能是什么问题吗？

我尝试了e.pageX，e.clientX和e.offsetX，但仍无法解决此问题。 （或者我错过了某些东西）

Answer 1

您需要在形状中添加滚动顶部位置。如果您希望您的方格保持在正确的位置，请检查：

function repositionShape(e) {
    $self = repositionStart.self;
    $commentSection = repositionStart.commentSection;

    var dy = $('.wrapper').scrollTop(); // Get wrapper scroll position

    $self.css({
    'left': e.clientX - repositionStart.offset.left,
        'top': e.clientY - repositionStart.offset.top +dy // Add delta to your square position
    });
}