我有一个div（它包含一个缩放iFrame），我想在屏幕上移动它。但是...有时如果用户用鼠标不平稳，它会粘在指针上，唯一的方法就是刷新页面。
这是其他人经历过的事情吗？你是如何解决的？
我可以想象这与我的Javascript部分以及我如何监听一些事件有关。
编辑：想补充一下，下面的代码基本上是根据本文中的Vue进行调整的：https://javascript.info/mouse-drag-and-drop
提前感谢！
于飞：

<div
  class="zoom-wrapper"
  ref="draggableContainer"
>
  <div
    @mousedown="dragMouseDown"
    ref="grabBar"
  </div>
</div>

Javascript语言

dragMouseDown(event) {
                event.preventDefault();
                const { draggableContainer, grabBar } = this.$refs;

                let shiftX = event.clientX - draggableContainer.getBoundingClientRect().left;
                let shiftY = event.clientY - draggableContainer.getBoundingClientRect().top;

                draggableContainer.style.position = 'absolute';
                draggableContainer.style.zIndex = 1000;

                moveAt(event.pageX, event.pageY);

                function moveAt(pageX, pageY) {
                    draggableContainer.style.left = pageX - shiftX + 'px';
                    draggableContainer.style.top = pageY - shiftY + 'px';
                }

                function onMouseMove(event) {
                    moveAt(event.pageX, event.pageY);
                }

                window.addEventListener('mousemove', onMouseMove);

                window.onmouseup = function () {
                    window.removeEventListener('mousemove', onMouseMove);
                    grabBar.removeEventListener('mousedown', this.dragMouseDown);
                    window.onmouseup = null;
                };
            },