Skip to content
Mike Schultz edited this page Aug 12, 2016 · 57 revisions

Javascript libraries for dealing with touch events, multitouch, normalizing across the Webkit/IE touch models, and all that jazz.

Touch Event Libraries

Dojo

  • dojo/touch - Dojo detection functions for touch events

jQuery

  • jquery.doubletap - Custom touch events for jQuery. Demo.
  • Touchy - Highly configurable jQuery plugin. Exposes event data (velocity, etc) for longpress, drag, pinch, rotate, swipe. Example use cases: prevent conflict between drag and swipe; get pinch abstracted across Android and iOS; create a single finger rotation.
  • jQuery UI Interactions - Rewrite of the existing jQuery UI interactions, now with mouse, touche and pointer (aka MSPointer) support. Work in progress, but draggable already works great for all three event APIs.
  • jquery-ui-touch-punch - A duck punch for adding touch events to jQuery UI
  • pep.jquery.js - A lightweight plugin for kinetic-drag on mobile & desktop
  • jQuery.event.move - jQuery special events movestart, move and moveend for tracking touch and mouse moves, throttled to browser animation frames, and exposing information about distance and velocity of fingers. Demo at stephband.info/jquery.event.move/.
  • jQuery.event.swipe - jQuery special events for the gestures swipeleft, swiperight, swipeup and swipedown, built on top of jQuery.event.move. Demo at stephband.info/jquery.event.swipe/.
  • jQuery Mobile vmouse - from the jQuery Mobile team. Supports normalized handling of mouse and touch events under one event convention: vclick, vmousedown, vmouseup, vmousemove, etc.
  • Touchable - Unifies touch and mouse events
  • http://jgestures.codeplex.com/
  • http://labs.skinkers.com/touchSwipe/
  • TipTap: normalizes mouse and touch events, and provides simple definition of complex gestures (any combination of tap, swipe, etc.) with simple callbacks.
  • jQuery Touch Gestures: Touch Gestures ported and fixed from QUOjs project. Available gestures: singleTap | doubleTap | hold | swipe | swiping | swipeLeft | swipeRight | swipeUp | swipeDown | rotate | rotating | rotateLeft | rotateRight | pinch | pinching | pinchIn | pinchOut | drag | dragLeft | dragRight | dragUp | dragDown

MooTools

  • mootools-mobile - Wraps click handlers with touch and provides some custom events.

YUI

Zepto

Other

  • Event.js - Multi-touch events library, and abstractions.
  • pointer.js - a pointer event polyfill.
  • jsTouchLayer - A javascript based touch events library, agnostic of any javascript libraries. Missing pinch/spread atm.
  • interact - abstracted mouse and touch events into generic pointer events. Uses eve under the hood.
  • tap.js - A lightweight 'tap' event JavaScript plugin for mobile browsers (no dependencies)
  • tappable - A simple, standalone library to invoke the tap event for touch-friendly web browsers.
  • Touchy - Lightweight (no dependencies) multi-touch, models individual fingers
  • Touch - Simple library, enables touch events, such as: swipe, pinch and tap.
  • thumbsjs - from the PhoneGap team. Heavily tested on many devices. Mature.
  • touch-layer - Custom events and gestures handler for touch enable mobile devices.
  • WKTouch - Hardware accelerated multi-touch drag, scale and rotate plugin for Mobile Webkit.
  • MagicTouch.js - Standards-compatible touch event polyfill to map trackpad touches to touch events. Uses NPAPI plugin.
  • Hammer.js - Lightweight library for multi-touch gestures

Gestures

  • Hammer.js - A javascript library (only 2kb) for multi-touch gestures: Tap, Drag, Pinch, Hold
  • Ember-Touch - A lightweight library for building and using touch gestures with Ember Applications.
  • Jester - Easy JavaScript gesture recognition for iPhone and iPad.
  • Mobile-Web-based-Gesture-Recognition - Based on Dollar. Demo.
  • shake.js - A custom 'shake' event plugin for mobile web browsers using device accelerometer. (Okay, not strictly touch, but it does require you to use your hand :P)
  • dojox/gesture - Dojo detection functions for gesture events
  • ZingTouch - Gesture detection library written in ES6. Comes with default gestures, but has the ability to extend and create new ones.

Scrolling

Speeding Up Click Events

Debugging

Touch Specific Components

  • Swipe JS - carousel (aka slider) component that is touch friendly
  • Swiper - mobile touch slider with hardware accelerated transitions
  • jQuery Mobile Pagination - touch-drag pagination between separate HTML documents or jQuery Mobile "pages"
  • wkslider - A touch–optimised UI range slider JavaScript plugin (no dependencies)

Multimedia (videos, tutorials, etc.)

Videos

Clone this wiki locally