使用javascript檢測幻燈片方向

Question

尋找一種使用TOUCHEND，TOUCHSTART事件的方式，允許用戶使用滑動手勢滾動頁面。我不知道如何確定方向（例如，獲取TOUCHEND和TOUCHSTART點的座標以確定方向）。

Answer 1

從概念上講，你可以這樣做：

1. 的touchstart和touchend註冊事件處理程序。
2. 在touchstart上，您將某個手指的x和y座標存儲在持久變量中。
3. 在屏幕上，您將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> yBegin，則表示它已關閉，否則關閉。
6. 如果兩個方向都不超過最小閾值，那麼手勢不夠大，不足以表示滑動手勢。

有關觸摸事件數據的信息，請參閱here on MDN。 MDN總是我尋找這種東西的第一個地方。