javascript - 处理拖动时的速度/惯性

Question

我在我的 Web 应用程序中构建了一个垂直 slider ，并支持 Hammer.js 的鼠标和触摸拖动事件。在拖动结束时(当用户释放鼠标按钮或将手指离开屏幕时，也称为“dragend”事件)，如果上面的事件更接近中间，则它会移动到中间，反之亦然。

问题是，当用户从下向上拖动鼠标(这意味着上面的将移动到中间)时，当拖动到 48% 时触发 Dragend 事件，如果速度足够高，下面的应该移动到中间。如何计算速度是否足够高？

Answer 1

我是这样解决的:

// y is the drag amount

// visible height
var height = $(this).height()

// difference
var diff = (Math.abs(y) % height) / height

// I checked Hammer.js's source. It defines velocity as the change in 16ms.
// So multiplying it by 62.5 gives you the change in 1s. 
// Not sure why I did that, but works pretty well in most situations
var inertia = event.gesture.velocityY * 62.5

if (
    (event.gesture.direction == 'up' && diff + (inertia / height) >= 0.5) ||
    (event.gesture.direction == 'down' && diff - (inertia / height) >= 0.5)
) {

    // show the one below

} else {

    // show the one above

}