The jQuery Mobile framework provides five touch events. They are the tap
,
taphold
,
swipe
,
swipeleft
, and
swiperight
events. The tap event is fired when you tap the screen. If the tap duration is longer, the taphold event is fired first and then the tap event is fired after you lift your finger. When you swipe across the screen, the swipe event is fired first and then the swipeleft or swiperight events are fired, based on the direction of your swipe action. This recipe shows you how to use these touch events.
In this recipe, a yellow box is shown where you last tapped the screen. A green box is created each time you tap and hold. You can also see how the swipe action works by swiping a blue bar to the left or right edge of the screen.
Copy the full code of this recipe from the code/08/touch sources folder. You can launch this code by using the URL http://localhost:8080/08/touch/main.html.