使用javascript检测幻灯片方向

Question

寻找一种方法来使用TOUCHEND，TOUCHSTART事件来允许用户使用幻灯片手势滚动页面。我不知道如何确定方向（例如，获取TOUCHEND和TOUCHSTART点的坐标以确定方向）。

Answer 1

从概念上讲，您可以这样做：

1. 注册touchstart和touchend的事件处理程序。
2. 在touchstart上，将特定手指的x和y坐标存储在持久变量中。
3. 在touchend上，您将x和y坐标与先前保存的值进行比较。
4. 如果Math.abs（deltaX）超过某个最小阈值并且Math.abs（deltaX）> Math.abs（deltaY），然后手势是左/右。如果xEnd大于xBegin，那么你将从左向右移动，否则从右向左移动。
5. 如果Math.abs（deltaY）超过某个最小阈值并且Math.abs（deltaY）> Math.abs（deltaX），然后运动上/下。如果yEnd＆gt; yBegin，那么它就会失效，否则就会失败。
6. 如果两个方向都不超过最小阈值，则手势不足以表示滑动手势。

有关触摸事件数据的信息，请参阅here on MDN。 MDN始终是我寻找这种东西的第一个地方。