Javascript 如何判断屏幕的哪个部分被划分为N个矩形（使用mousemove）

我需要将屏幕划分为20个部分（水平），并将鼠标位置的值从1设置为20，以更新精灵背景图像位置（用于平滑旋转动画）。下面的代码正在工作，但有一个问题，当我移动鼠标非常快-它可以跳过几个点，我需要总是改变一步的数字。我怎样才能做到这一点

---

好的，我看到了这个例子，我想我理解这个问题，下面是我将如何解决这个问题

看一看，让我知道它是否有效

var帧=20；
var frameWidth=Math.round（window.innerWidth/frames）；
var-xIndex；
var超时；
函数更新位置（x）{
如果（xIndex！=x）{
xIndex=x；
document.getElementById（'val'）。innerText=xIndex；
}
}
document.onmousemove=函数（e）{
//如果鼠标太快，请清除上一个调用。
clearTimeout（超时）；
//现在是对updatePosition的新调用
timeout=setTimeout（（）=>updatePosition（Math.round（e.clientX/frameWidth）），1）
//你可以玩一下超时，然后把它从1增加到100毫秒。看看你喜欢什么
}

---

好的，我看到了这个例子，我认为我理解这个问题，下面是我将如何解决这个问题

看一看，让我知道它是否有效


var帧=20；
var frameWidth=Math.round（window.innerWidth/frames）；
var-xIndex；
var超时；
函数更新位置（x）{
如果（xIndex！=x）{
xIndex=x；
document.getElementById（'val'）。innerText=xIndex；
}
}
document.onmousemove=函数（e）{
//如果鼠标太快，请清除上一个调用。
clearTimeout（超时）；
//现在是对updatePosition的新调用
timeout=setTimeout（（）=>updatePosition（Math.round（e.clientX/frameWidth）），1）
//你可以玩一下超时，然后把它从1增加到100毫秒。看看你喜欢什么
}
请提供一个工作示例，以便于测试我们提供的解决方案。您需要在两个点之间插值，创建假点。@NikKyriakides我不知道您的意思，有机会使用密码笔吗？我自己没有时间，但我的意思是你需要在鼠标进入该区域的起点和该区域内鼠标的最后一个已知点之间切换。这将给你模拟（假点）之间的2。当你移动鼠标太快时，浏览器不会报告足够多的点，因此你必须自己创建（伪造）它们。请提供一个工作示例，以便更容易地测试我们提供的解决方案。你需要在两个点之间插值，创建假点。@NikKyriakides我不知道你的意思，有机会使用密码笔吗？我自己没有时间，但我的意思是你需要在鼠标进入该区域的起点和该区域内鼠标的最后一个已知点之间切换。这将给你模拟（假点）之间的2。当您移动鼠标太快时，浏览器不会报告足够的点，因此您必须自己创建（伪造）这些点。
var frames = 20;
var frameWidth = Math.round(window.innerWidth / frames);
var xIndex;

function updatePosition(x) {
    if (xIndex != x) {
        xIndex = x;
        document.getElementById('val').innerText = xIndex;
    }
}

document.onmousemove = function(e) {
    updatePosition(Math.round(e.clientX / frameWidth));
}