jQuery event touchclick

jquery.touchclick.js

$.event.special.touchclick = {
	setup : function(data) {
		var elt = $(this);

		elt.data($.extend({
			sens : 25 // Available touch offset in pixels
		}, data));

		elt.bind("touchstart", $.event.special.touchclick.onTouchstart);
		elt.bind("touchend", $.event.special.touchclick.onTouchend);
	},

	teardown : function() {
		var elt = $(this);
		elt.unbind("touchstart", $.event.special.touchclick.onTouchstart);
		elt.unbind("touchend", $.event.special.touchclick.onTouchend);
	},

	onTouchstart : function(event) {
		var elt = $(this);
		elt.data("startPageX", event.originalEvent.touches[0].pageX);
		elt.data("startPageY", event.originalEvent.touches[0].pageY);
	},

	onTouchend : function(event) {
		var elt = $(this);
		var diffX = Math.abs(event.originalEvent.changedTouches[0].pageX - elt.data("startPageX"));
		var diffY = Math.abs(event.originalEvent.changedTouches[0].pageY - elt.data("startPageY"));

		elt.data({
			startPageX : null,
			startPageY : null
		});

		var sens = elt.data("sens");
		if (diffX < sens && diffY < sens /* FIXBUG OF TWICE FIRING */ && event.originalEvent["touches"].length == 0) {
			event.preventDefault();
			event.type = "touchclick";
			$.event.dispatch.apply(this, arguments);
		}
	}
};

Usage

$("#root").on("touchclick", ".item", function() {
  // ...
});