jQuery Mobile "Touch Events"

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

| | Touch events can also be applied to desktop computers: clicking or swiping with the mouse! | | --- | --- |

jQuery Mobile Tap

The tap event is triggered when a user taps an element.

Here is an example: When a <p> element is tapped, hide the current <p> element:

Example

jQuery Mobile Tap and Hold (Long Press)

The tap and hold (long press) event is triggered after tapping and not releasing (for about one second).

Example

jQuery Mobile Swipe

The swipe event is triggered when a user drags horizontally more than 30px within one second, or vertically less than 20px:

Example

jQuery Mobile Swipe Left

The swipe left event is triggered when a user drags an element to the left by more than 30px:

Example

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

jQuery Mobile Swipe Right

The swipe right event is triggered when a user drags an element to the right by more than 30px:

Example