node package manager
Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »



npm install node-touch

Extra touch events and hover behaviour for touch devices.

<div class="touch">Example</div>

In order to use the features, you have to call the module once in the beginning and create the dom elements with the touch class.


div { ... }
div.hover { ... }

On touch devices, the hover behaviour is quite crappy. With this module, if you use the .hover class instead of the :hover pseudoclass, on a touch device the class will be applied when the element is touched on the screen, and on a non-touch device it will act as :hover. example.


var button = document.createElement('button').
button.addEventListener('tap', function (event) {
}, false);

You can use the tap event just as a normal event. It is sort of the touch equivalent of click.


var div = document.querySelector('div');
div.addEventListener('touchleave', function (event) {
}, false);

The event fires when the finger left the element.


You can add listeners to swipe events. There are three type of swipe events.

div.addEventListener('swipestart', function (event) {});
div.addEventListener('swipemove', function (event) {});
div.addEventListener('swipeend', function (event) {});

The event object's important properties are:

  • direction: RIGHT, LEFT, UP, DOWN
  • delta: how much pixel it moved from the starting touch (relative to the direction)
  • startTouch: the starting touch object
  • prevTouch: the previous touch object
  • changedTouch: the latest touch object


This module sets a global Boolean that just tells you whether the user is on a touch device. It can be useful!