javascript - 滚动容器时拖动元素出错

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
    });
}