Adding touch events to your mobile application

The Kendo UI Mobile framework provides various APIs to handle touch-based events. The applications that you build should not only allow the user to perform regular select events on the touch interface, but they should also handle various touch gestures such as double tap, swipe, and drag-and-drop. In this recipe, we will take a look at the various touch events that can be added.

How to do it…

For the purpose of this example, let's consider the same layout used in the previous recipe and add a view to the page. The content of this view would be a touch widget that specifies an area in the view enabled for touch events:

<div 
  data-role="view"
  data-layout="defaultLayout">
  <div
    id="touchSurface"
    data-role="touch"
    data-enable-swipe="1"
    data-touchstart="touchstart"
    data-swipe="swipe"
    data-tap="tap"
    data-doubletap="doubletap"
    data-hold="hold"
    style="height: 200px;">

    Touch Surface

  </div&gt...