Javascript 滚动函数以指数方式移动

我的画布有一个滚动功能，可以检测鼠标移动的距离，并偏移画布中的所有图像

问题是我几乎不移动鼠标，偏移量呈指数增长，我不知道为什么。。。这是我处理偏移计算的函数：

canvas.addEventListener('mousedown', scrol_cnv, false);

function scroll_cnv(e) {
    if (e.button == 2) {//right click only
        var x = e.pageX; // get click X
        var y = e.pageY; //get click Y

            function clear() {
                this.removeEventListener('mousemove', updt, false);
            }

            function updt(evt) {
                var difx = evt.pageX - x;
                var dify = evt.pageY - y;

                   //this is where offset is becoming incorrect
                   //offsets is globally defined `window.offsets = {}`
                offsets.cur_offsetx -= difx;
                offsets.cur_offsety -= dify; 

            }
        this.addEventListener('mousemove', updt, false);
        this.addEventListener('mouseup', clear, false);

    }
}

---

我是否错误地减去了偏移量？

您希望偏移量基于

鼠标向下移动时的偏移量。频繁发生的事件不应该毫无根据地改变事情

您可能还想删除您的
mouseup
listener，否则每次单击都会得到一个额外的侦听器（没有功能损害，只是不必要的开销）

我认为您不想使用
-=
cur|u offset
应该只是当前的差异，所以只要设置
cur|u offset（x | y）=dif（x | y）
。我添加了一个关于事件侦听器的注释。如果鼠标调用clear，你确定我需要在
clear
中启动鼠标吗？每次
scroll\u cnv
都被调用
this。addEventListener（'mouseup'，clear，false）也被称为。它将不断添加另一个侦听器，并被多次调用。您需要在这个函数之外附加一次处理程序，在最后删除处理程序，或者找到另一种方法使它只发生一次。这没什么大不了的，除非用户拖了很多次。最终它将导致性能损失。但是您的答案是否已将其附加到删除中的
updt
函数？是的，对不起。复制/粘贴错误。
canvas.addEventListener('mousedown', scrol_cnv, false);

function scroll_cnv(e) {
    if (e.button == 2) {//right click only
        var x = e.pageX; // get click X
        var y = e.pageY; //get click Y

        // store the initial offsets
        var init_offsetx = offsets.cur_offsetx;
        var init_offsety = offsets.cur_offsety;


            function clear() {
                this.removeEventListener('mousemove', updt, false);
                this.removeEventListener('mouseup', clear, false);
            }

            function updt(evt) {
                var difx = evt.pageX - x;
                var dify = evt.pageY - y;

                //this is where offset is becoming incorrect
                //offsets is globally defined `window.offsets = {}`
                offsets.cur_offsetx = init_offsetx - difx;
                offsets.cur_offsety = init_offsetx - dify; 

            }
        this.addEventListener('mousemove', updt, false);
        this.addEventListener('mouseup', clear, false);

    }
}