如何用纯JavaScript获得10毫秒的旧鼠标位置？

我正在制作一个滑块，当它向左滑动时向左移动，向右滑动时向右滑动。她是我迄今为止取得的成绩https://jsfiddle.net/6ze720f7/。尽管我现在可以将左侧的位置设置为左侧：显示左侧时为0，位置为左侧时：显示右侧时为446像素。如何用纯JavaScript获得10毫秒的旧鼠标位置？

，是以方向护理的代码是：

center.onmousemove = function(Dmove) { 
if (Dmove.pageX < oldx) { 
    direction = "left" 
} else if (Dmove.pageX > oldx) { 
    direction = "right" 
} 

oldx = Dmove.pageX; 
}

我所担心的是，oldx和Dmove.pageX之间的差别是非常非常小的，更精确地在执行拍摄的时间量几行javascript代码。所以如果div被刷到左边1秒，但最后它会错误地向右移动几毫秒，然后div将被刷到右边。我认为的解决方案是使用旧版本的10年前的oldx。

是否有可能找到10毫秒的旧值比目前的Dmove.pageX？
是否可以给同步延迟10毫秒之后的语句oldx = Dmove.pageX;？
是否可以使用setInterval()函数以便在每10秒钟后设置值oldx？这可能有点问题，因为oldx与当前值Dmove.pageX之间的差异可以在事件发生时在0到10毫秒之间取任何值。

来源

2016-05-16 user31782

'10ms'是一个非常短的时间。但是，例如，您可以在每次鼠标移动后设置一个“10ms”超时，以更新“oldx”。使用这个方法你会每秒创建100个超时，这在性能方面并不是很好。再次，'10ms'是一个很短的时间，我认为你至少应该把它增加到'50ms'。 – Cristy

另一种选择是将所有鼠标位置及其时间戳保存在队列中。每当队列中的第一个项目超过10毫秒时，就从队列中弹出。在队列末尾添加新项目。要找到10ms前发生的位置，只需读取队列中的第一个值。 – Cristy

@Cristy在每个mousmove事件之后不会设置10ms超时会导致'div'移动的模糊效果？ – user31782

我建议（如果适用于您的情况）采用另一种方法：比较滑动开始时的x位置（即：拖动或mosedown事件的开始）和x位置结束或在滑动过程中（即：mouseup或mousemove事件）。这给：

document.body.onmousedown = function(Dmove) { 
    oldx = Dmove.pageX; 
    ... 
    ... 
}

不要修改oldx其他地方，并比较在onmousedown或onmouseup事件侦听器“初始”值。

来源

2016-05-16 10:16:04

这是完全拧紧的方法。假设最初的x位置是50.现在我将div滑动到“x = 10”，然后回到“x = 25”。总体来说，x位置下降，但最终用户想要向右滑动。用你的方法div将向左滑动。 – user31782

@ user31782由于您在每次鼠标移动时更新'oldx'，初始设置只会使mousemove从第一个像素移动更加精确。 –

@ user31782这就是为什么我说“如果适用于您的情况”。我的丈夫做了以下工作：1。如果用户在“x：50”处开始滑动（或拖动），经过“x：10”但不释放鼠标（或向上移动手指）然后转到“x：25”，则认为滑动。 2.另一方面，如果用户在“x：50”处开始滑动（或拖动），以“x：10”释放，然后再次滑动到“x：25”，则第二次滑动被认为是正确的。 –

如何用纯JavaScript获得10毫秒的旧鼠标位置？

回答

相关问题