Event | Trigger |
---|---|
touchstart | User makes contact with the touch surface and creates a touch point inside the element the event is bound to. |
touchmove | Triggers when the user moves the touch point across the touch surface. |
touchend | Triggers when the user removes a touch point from the surface. It fires regardless of whether the touch point is removed while inside the bound-to element, or outside, such as if the user's finger slides out of the element first or even off the edge of the screen. |
touchcancel | Triggers when the touch point no longer registers on the touch surface. This can occur if the user has moved the touch point outside the browser UI or into a plugin, for example, or if an alert modal pops up. |
Can use object's properties to get location
pageX and pageY = location relative to the top left of the fully rendered content area in the browser.
clientX and clientY = Relative to the upper left edge of the content area (the viewport) of the browser window. This point does not move even if the user moves a scrollbar from within the browser.
Touch the box, then drag your finger to see the current state of the touch and the distance traveled.