Skip to content

Latest commit

 

History

History
44 lines (33 loc) · 1.08 KB

README.md

File metadata and controls

44 lines (33 loc) · 1.08 KB
Raw

swinch.js

A lightweight, customisable, horizontal touch detection script

swinch is a vanilla JavaScript plugin that detects horizontal swipes on the element you pass to it, and provides callbacks with the distance travelled during the swipe, and the direction of the swipe at the end.

Usage

var swipeElem = new swinch(document.getElementById('swipe-elem'), {
  onMove: function(distance) {
    // you could easily translate the element 1:1 using distance
  },
  
  onEnd: function(direction) {
    if (direction === 'left') {
      doSomethingOnLeft();
    }
    else {
      doSomethingOnRight();
    }
  }
});

The sensitivity of the swipe can be adjusted per instance with thresholdDuration (default: 50 [ms]) and thresholdDistance (default: 30 [px]) options. For example:

var swipeElem = new swinch(document.getElementById('swipe-elem'), {
  thresholdDuration: 150,
  thresholdDistance: 100,
  
  onMove: function(distance) {
  },
  
  onEnd: function(direction) {
  }
});

Copyright (c) 2014 Matt Stow
Licensed under the MIT license (see LICENSE for details)