Hello Kelvin,

Following the provided steps I was able to observe the issue, which is indeed to the scrolling. Please note that the drag button position is set manually, so when scrolling occurs, you can just add the scrollY (and scrollY for horizontal scrolling) to the calculation of the drag position. I have modified one of the examples to include the "scrollY" and the issue seems to be resolved as expected:

• https://stackblitz.com/edit/react-nd7o7v?file=app%2Fdraggable-button.jsx

  const handleDrag = React.useCallback(
    (event) => {
      console.log(event.scrollY);
      let zoomRation = 1; //Math.round(window.devicePixelRatio);
      if (!button.current || !button.current.element || !initial) {
        return;
      }
      const transform = `translate(${
        (event.clientX - initial.x) * zoomRation
      }px, ${(event.clientY - initial.y + event.scrollY) * zoomRation}px)`;
      button.current.element.style.transition = 'none';
      button.current.element.style.transform = transform;
    },
    [initial]
  );

Please let me know if everything works as expected on your side too.

Regards,
Konstantin Dikov
Progress Telerik

Hello Kelvin,

Thank you for contacting us.

I have tried different scenarios with the provided information, but I have to say that I was not able to reproduce any issues while changing the window size or scrolling. Please provide a list with the exact steps to reproduce the issue or record a short video demonstrating it.

Looking forward to your reply. 

Regards,
Konstantin Dikov
Progress Telerik