Touch

  • Revision slug: DOM/Touch
  • Revision title: Touch
  • Revision id: 18115
  • Created:
  • Creator: Sheppy
  • Is current revision? No
  • Comment note the hardware dependent nature of some values; 76 words added

Revision Content

{{ domref() }}

A Touch object represents a single point of contact between the user and a touch-sensitive interface device (which may be, for example, a touchscreen or a trackpad).

Attributes

The following attributes describe the user's touch.

Note: Many of these values are hardware-dependent; for example, if the device doesn't have a way to detect the amount of pressure placed on the surface, the force value will always be 1.0. This may also be the case for radiusX and radiusY; if the hardware reports only a single point, these values will be 1.
{{ domxref("Touch.identifier") }}
A unique identifier for this Touch object. A given touch (say, by a finger) will have the same identifier for the duration of its movement around the surface. This lets you ensure that you're tracking the same touch all the time. Read only.
{{ domxref("Touch.screenX") }}
The X coordinate of the touch point relative to the screen, not including any scroll offset. Read only.
{{ domxref("Touch.screenY") }}
The Y coordinate of the touch point relative to the screen, not including any scroll offset. Read only.
{{ domxref("Touch.clientX") }}
The X coordinate of the touch point relative to the viewport, not including any scroll offset. Read only.
{{ domxref("Touch.clientY") }}
The Y coordinate of the touch point relative to the viewport, not including any scroll offset. Read only.
{{ domxref("Touch.pageX") }}
The X coordinate of the touch point relative to the viewport, including any scroll offset. Read only.
{{ domxref("Touch.pageY") }}
The Y coordinate of the touch point relative to the viewport, including any scroll offset. Read only.
{{ domxref("Touch.radiusX") }}
The X radius of the ellipse that most closely circumscribes the area of contact with the screen. The value is in pixels of the same scale as screenX. Read only.
{{ domxref("Touch.radiusY") }}
The Y radius of the ellipse that most closely circumscribes the area of contact with the screen. The value is in pixels of the same scale as screenY. Read only.
{{ domxref("Touch.rotationAngle") }}
The angle (in degrees) that the ellipse described by radiusX and radiusY must be rotated, clockwise, to most accurately cover the area of contact between the user and the surface. Read only.
{{ domxref("Touch.force") }}
The amount of pressure being applied to the surface by the user, as a float between 0.0 (no pressure) and 1.0 (maximum pressure). Read only.

The touch area

The {{ domxref("Touch.radiusX") }}, {{ domxref("Touch.radiusY") }}, and {{ domxref("Touch.rotationAngle") }} describe the area of contact between the user and the screen. This can be helpful when dealing with imprecise pointing devices such as fingers. These values are set to describe an ellipse that as closely as possible matches the entire area of contact (such as the user's fingertip).

See also

  • Touch events
  • {{ domxref("Touch") }}
  • {{ domxref("TouchList") }}
  • {{ domxref("TouchEvent") }}

Specification

Touch Events Specification

Revision Source

<p>{{ domref() }}</p>
<p>A <code>Touch</code> object represents a single point of contact between the user and a touch-sensitive interface device (which may be, for example, a touchscreen or a trackpad).</p>
<h2>Attributes</h2>
<p>The following attributes describe the user's touch.</p>
<div class="note"><strong>Note:</strong> Many of these values are hardware-dependent; for example, if the device doesn't have a way to detect the amount of pressure placed on the surface, the <code>force</code> value will always be 1.0. This may also be the case for <code>radiusX</code> and <code>radiusY</code>; if the hardware reports only a single point, these values will be 1.</div>
<dl> <dt>{{ domxref("Touch.identifier") }}</dt> <dd>A unique identifier for this <code>Touch</code> object. A given touch (say, by a finger) will have the same identifier for the duration of its movement around the surface. This lets you ensure that you're tracking the same touch all the time. <strong>Read only.</strong></dd> <dt><strong>{{ domxref("Touch.screenX") }}</strong></dt> <dd>The X coordinate of the touch point relative to the screen, not including any scroll offset. <strong>Read only.</strong></dd> <dt><strong>{{ domxref("Touch.screenY") }}</strong></dt> <dd>The Y coordinate of the touch point relative to the screen, not including any scroll offset. <strong>Read only.</strong></dd> <dt><strong>{{ domxref("Touch.clientX") }}</strong></dt> <dd>The X coordinate of the touch point relative to the viewport, not including any scroll offset. <strong>Read only.</strong></dd> <dt><strong>{{ domxref("Touch.clientY") }}</strong></dt> <dd>The Y coordinate of the touch point relative to the viewport, not including any scroll offset. <strong>Read only.</strong></dd> <dt>{{ domxref("Touch.pageX") }}</dt> <dd>The X coordinate of the touch point relative to the viewport, including any scroll offset. <strong>Read only.</strong></dd> <dt>{{ domxref("Touch.pageY") }}</dt> <dd>The Y coordinate of the touch point relative to the viewport, including any scroll offset. <strong>Read only.</strong></dd> <dt>{{ domxref("Touch.radiusX") }}</dt> <dd>The X radius of the ellipse that most closely circumscribes the area of contact with the screen. The value is in pixels of the same scale as <code>screenX</code>. <strong>Read only.</strong></dd> <dt>{{ domxref("Touch.radiusY") }}</dt> <dd>The Y radius of the ellipse that most closely circumscribes the area of contact with the screen. The value is in pixels of the same scale as <code>screenY</code>. <strong>Read only.</strong></dd> <dt>{{ domxref("Touch.rotationAngle") }}</dt> <dd>The angle (in degrees) that the ellipse described by radiusX and radiusY must be rotated, clockwise, to most accurately cover the area of contact between the user and the surface. <strong>Read only.</strong></dd> <dt>{{ domxref("Touch.force") }}</dt> <dd>The amount of pressure being applied to the surface by the user, as a float between 0.0 (no pressure) and 1.0 (maximum pressure). <strong>Read only.</strong></dd>
</dl>
<h2>The touch area</h2>
<p>The {{ domxref("Touch.radiusX") }}, {{ domxref("Touch.radiusY") }}, and {{ domxref("Touch.rotationAngle") }} describe the area of contact between the user and the screen. This can be helpful when dealing with imprecise pointing devices such as fingers. These values are set to describe an ellipse that as closely as possible matches the entire area of contact (such as the user's fingertip).</p>
<dl> <h2>See also</h2> <ul> <li><a href="/en/DOM/Touch_events" title="en/DOM/Touch events">Touch events</a></li> <li>{{ domxref("Touch") }}</li> <li>{{ domxref("TouchList") }}</li> <li>{{ domxref("TouchEvent") }}</li> </ul> <h3 name="Specification">Specification</h3> <p><a class=" external" href="http://www.w3.org/TR/touch-events/" title="http://www.w3.org/TR/touch-events/">Touch Events Specification</a></p></dl>
Revert to this revision