jQuery – TouchSwipe 簡單支援 Swipe 滑動手勢的偵測

現在做 WebAPP 簡直是家常便飯的時候了,要把 Web 做成更高的易用性,jQuery 在今天還是非常好懂得工具而且超方便,尤其是這種滑動的套件,真的是太簡單了。如果要在手機拖曳的話,請看這篇

使用套件:TouchSwipe-Jquery-Plugin

或是使用 npm 裝到開發環境裡

使用方式

swipe() 回傳的參數

  • event 事件
  • direction 滑動的方向,如果是點擊的話,會是 null
  • distance 滑動的距離
  • duration 滑動持續的時間
  • fingerCount 使用的手指頭數量
  • fingerData 在事件中手指頭的座標
  • currentDirection 使用者正在滑動的當前方向,目前看起來與 distance 一樣,不知道差別在哪….

選用的參數與支援的方法可以參考官方的設定

通常我會把 threshold 設定為 0。這樣當滑動大於 0px 的時候,就會觸發事件,預設的滑動要大於 75px 才會觸發。

 

發表迴響