HTML5 APPLICATIONS DEVELOPMENT MANUAL
lu
(lu)
#1
touch event. You can use JavaScript to create touch events in touch-enabled
apps. Developers can draw from a large set of input application programming
interfaces (APIs) that work with touch screen data.
The primary JavaScript touch events are:
- touchstart: Every new finger touch triggers a touchstart event.
- touchmove: When a finger moves around the surface of the screen, a
touchmove event occurs, which tracks the finger movement.
- touchend: Lifting the finger from the screen triggers a touchend event.
- touchcancel: The touchcancel event is triggered when the device launches
another application.
In JavaScript, the touch object detects input from touch-enabled
devices. You reference touch objects in the touchlist, which includes all of
the points of contact with a touch screen.
A single tap has one entry in the touchlist, whereas a three-finger
gesture would have a total of three entries. Touch objects are read-only and
have the following properties:
- identifier: A unique identifier for the touch
- target: The HTML element that the touch affected
- clientx: Horizontal position, relative to browser window
- clienty: Vertical position, relative to browser window
- pagex: Horizontal position, relative to HTML document
- pagex: Vertical position, relative to HTML document
- screenx: Horizontal position, relative to the screen
- screeny: Vertical position, relative to the screen
- rotation: Indicates the amount of two-finger rotation that occurred. The
value of the rotation is in degrees; positive values are clockwise, and negative
values are counterclockwise.
Each touch event includes three different touchlists:
- touches: A list of all touch points currently in contact with the screen
- targetTouches: A list of touch points currently in contact with the screen
and whose touchstart event occurred within the same node (inside the same
target element as the current target element)
- changedTouches: A list of touch points that caused the current event to be
