JavaScript tap event for touch devices

JavaScript touch events are awesome and they are standardized (Candidate recommendation) by the W3C, making them safe to use for building your touch enabled web-apps. There are 4 touch events:

1. "touchstart" - When a finger in placed on the screen
2. "touchmove" - When a finger moves on the screen
3. "touchend" - When a finger is lifted from the screen
4. "touchcancel" - When touch is canceled, like when an alert appears or a call comes in.

But, what constitutes a "tap", like a "click" in the mouse model you might wonder. There a several answers to this. A tap might be simply a "touchend". But, what if the user places a finger on a button and then flicks the screen up so that the button goes off screen, now the button will fire a "touchend" when it's off screen. And what if the user holds a button for a long time and then lets go, should that fire an event?

To combat these issues I've created a Javascript library (and a jQuery plugin) which will handle all of this for you. You simply add the library or plugin to your project and then you add the spanking new "tap" event to your button or what have you. The "tap" library will then try to take care of the issues mentioned above.

Using it is simple:

 var tapHandler = function(e){  
    //Do something  
 }  
 document.getElementById('aDiv').tap(tapHandler);

Take a look at the documentation inside of the source files and of course, look at the demo.

• Get the source
• Checkout the demo