jQuery Mobile Touch Events

Touch events are triggered when the user touches the screen (page).

Touch events also work on desktop computers: tap and swipe with your mouse!

jQuery Mobile Tap

The tap event is triggered when the user taps on an element.

The following example says: When a tap event fires on a <p> element; hide the current <p> element:

$("p").on("tap",function(){
$(this).hide();
});

The taphold event is triggered when the user taps on an element and hold for one second:

$("p").on("taphold",function(){
$(this).hide();
});

The swipe event is triggered when the user swipes over an element horizontally by more than 30px:

$("p").on("swipe",function(){
$("span").text("Swipe detected!");
});

The swipeleft event is triggered when the user swipes over an element in the left direction by more than 30px:

$("p").on("swipeleft",function(){
alert("You swiped left!");
});

The swiperight event is triggered when the user drags over an element in the right direction by more than 30px:

$("p").on("swiperight",function(){
alert("You swiped right!");
});