Detect Touch Swipe Direction In JavaScript – touchSweep

Category: Javascript | June 13, 2020
Author: scriptex
Views Total: 541 views
Official Page: Go to website
Last Update: June 13, 2020
License: MIT

Preview:

Detect Touch Swipe Direction In JavaScript – touchSweep

Description:

touchSweep is a JavaScript library for the mobile app that detects the swipe direction and triggers certain functions as you tap and swipe on the screen.

How to use it:

Install and import the touchSweep library into the project.

# Yarn
$ yarn add touchsweep

# NPM
$ npm install touchsweep --save

Initialize the library on the target element where you want to detect the swipe direction.

const el = document.getElementById('touchswipe');
const data = {
      value: 1
};
const threshold = 20;

new TouchSweep(el, data, threshold);

Bind custom events to the swipe & tap events.

el.addEventListener('swipeleft', event => {
  // event.detail
});

el.addEventListener('swiperight', event => {
  // event.detail
});

el.addEventListener('swipedown', event => {
  // event.detail
});

el.addEventListener('swipeup', event => {
  // event.detail
});

el.addEventListener('tap', event => {
  // event.detail
});

Changelog:

v1.1.0 (06/13/2020)

  • fixes a minor issue when determing the direction of the swipe

You Might Be Interested In:


Leave a Reply