Skip to main content

Touch

The Touch interface represents a single contact point on a touch-sensitive device. The contact point is commonly a finger or stylus and the device may be a touchscreen or trackpad.

MDN Reference

Properties​

clientX​

readonly clientX: number;

The Touch.clientX read-only property returns the X coordinate of the touch point relative to the viewport, not including any scroll offset.

MDN Reference

clientY​

readonly clientY: number;

The Touch.clientY read-only property returns the Y coordinate of the touch point relative to the browser's viewport, not including any scroll offset.

MDN Reference

force​

readonly force: number;

The Touch.force read-only property returns the amount of pressure the user is applying to the touch surface for a Touch point.

MDN Reference

identifier​

readonly identifier: number;

The Touch.identifier returns a value uniquely identifying this point of contact with the touch surface. This value remains consistent for every event involving this finger's (or stylus's) movement on the surface until it is lifted off the surface.

MDN Reference

pageX​

readonly pageX: number;

The Touch.pageX read-only property returns the X coordinate of the touch point relative to the viewport, including any scroll offset.

MDN Reference

pageY​

readonly pageY: number;

The Touch.pageY read-only property returns the Y coordinate of the touch point relative to the viewport, including any scroll offset.

MDN Reference

radiusX​

readonly radiusX: number;

The radiusX read-only property of the Touch interface returns the X radius of the ellipse that most closely circumscribes the area of contact with the touch surface. The value is in CSS pixels of the same scale as Touch.screenX.

MDN Reference

radiusY​

readonly radiusY: number;

The radiusY read-only property of the Touch interface returns the Y radius of the ellipse that most closely circumscribes the area of contact with the touch surface. The value is in CSS pixels of the same scale as Touch.screenX.

MDN Reference

rotationAngle​

readonly rotationAngle: number;

The rotationAngle read-only property of the Touch interface returns the rotation angle, in degrees, of the contact area ellipse defined by Touch.radiusX and Touch.radiusY. The value may be between 0 and 90. Together, these three values describe an ellipse that approximates the size and shape of the area of contact between the user and the screen. This may be a relatively large ellipse representing the contact between a fingertip and the screen or a small area representing the tip of a stylus, for example.

MDN Reference

screenX​

readonly screenX: number;

Returns the X coordinate of the touch point relative to the screen, not including any scroll offset.

MDN Reference

screenY​

readonly screenY: number;

Returns the Y coordinate of the touch point relative to the screen, not including any scroll offset.

MDN Reference

target​

readonly target: EventTarget;

The read-only target property of the Touch interface returns the (EventTarget) on which the touch contact started when it was first placed on the surface, even if the touch point has since moved outside the interactive area of that element or even been removed from the document. Note that if the target element is removed from the document, events will still be targeted at it, and hence won't necessarily bubble up to the window or document anymore. If there is any risk of an element being removed while it is being touched, the best practice is to attach the touch listeners directly to the target.

MDN Reference