search

anseki / plain-draggable

The simple and high performance library to allow HTML/SVG element to be dragged.
https://anseki.github.io/plain-draggable/
MIT License
765 stars 96 forks source link

Bad position when some ancestor is scaled #105

Closed ogadaki closed 2 years ago

ogadaki commented 2 years ago

If some parent is scaled using CSS, the position of the draggable during dragging isn't the mouse position. For example with a scale of 0.5 the moving distance of the draggable is half the one of the mouse.

Code example:

<div
  style="
    width: 600px; height: 600px; padding: 10px; background-color: #eeeeee;
    transform: scale(0.5);
  "
>
  <div id="draggable" style="padding: 20px; width: 100px; background-color: white;">
    drag me
  </div>
</div>
const draggable = new PlainDraggable(document.getElementById('draggable'))
anseki commented 2 years ago

Hi @ogadaki, thank you for the comment. This may help you: https://github.com/anseki/plain-draggable/issues/13

ogadaki commented 2 years ago

Hi @aneski, thanks for your quick reply, I'll take a look.

For a bit of context, I saw this while combining PlainDraggable with panzzom.

And I forgot an important point from my initial message: thanks a lot for your work! I'm just starting to use it but, from what I'm reading, this tool (and others like LeaderLine) will be very useful to me.

anseki commented 2 years ago

I'm glad if I could help you. :smile: Could you close this issue if it is solved?