### Detecting input type with pointerType (Example 2)
Source: https://www.w3.org/TR/pointerevents3
Detects the input type by switching on event.pointerType. The default case covers an empty pointerType (unable to detect) or a UA-specific custom type.
```javascript
window.addEventListener("pointerdown", detectInputType);
function detectInputType(event) {
switch(event.pointerType) {
case "mouse":
/* mouse input detected */
break;
case "pen":
/* pen/stylus input detected */
break;
case "touch":
/* touch input detected */
break;
default:
/* pointerType is empty (could not be detected)
or UA-specific custom type */
}
}
```
--------------------------------
### Feature detection and event binding (Example 1)
Source: https://www.w3.org/TR/pointerevents3
Feature detection for Pointer Events. If window.PointerEvent exists, only pointer events are used; otherwise fallback to touch and mouse handlers. The comment notes that e.preventDefault() on touchstart prevents compatibility mouse events and click.
```javascript
/* Bind to either Pointer Events or traditional touch/mouse */
if (window.PointerEvent) {
// if Pointer Events are supported, only listen to pointer events
target.addEventListener("pointerdown", function(e) {
// if necessary, apply separate logic based on e.pointerType
// for different touch/pen/mouse behavior
...
});
...
} else {
// traditional touch/mouse event handlers
target.addEventListener('touchstart', function(e) {
// prevent compatibility mouse events and click
e.preventDefault();
...
});
...
target.addEventListener('mousedown', ...);
...
}
// additional event listeners for keyboard handling
...
```
--------------------------------
### Firing untrusted pointer events (Example 4)
Source: https://www.w3.org/TR/pointerevents3
Fires untrusted pointer events from script using the PointerEvent constructor and dispatchEvent. Shows how to set pointerId, pointerType, clientX/clientY, and coalescedEvents for a pointermove event.
```javascript
const event1 = new PointerEvent("pointerover",
{ bubbles: true,
cancelable: true,
composed: true,
pointerId: 42,
pointerType: "pen",
clientX: 300,
clientY: 500
});
eventTarget.dispatchEvent(event1);
let pointerEventInitDict =
{
bubbles: true,
cancelable: true,
composed: true,
pointerId: 42,
pointerType: "pen",
clientX: 300,
clientY: 500,
};
const p1 = new PointerEvent("pointermove", pointerEventInitDict);
pointerEventInitDict.clientX += 10;
const p2 = new PointerEvent("pointermove", pointerEventInitDict);
pointerEventInitDict.coalescedEvents = [p1, p2];
const event2 = new PointerEvent("pointermove", pointerEventInitDict);
eventTarget.dispatchEvent(event2);
```
--------------------------------
### Resizing element to contact geometry (Example 3)
Source: https://www.w3.org/TR/pointerevents3
Resizes the target element to match the contact geometry (event.width and event.height) on pointerdown. The HTML includes a div with absolute positioning and a script that attaches the handler.
```html
```
--------------------------------
### Basic canvas drawing application using coalesced events
Source: https://www.w3.org/TR/pointerevents3
Example 10 from section 10.1 Coalesced events. Uses the PointerEvent.getCoalescedEvents() method to paint all raw/non-coalesced pointer points on a canvas. The CSS touch-action: none disables user agent panning/zooming so events reach the application. Falls back to painting the final coalesced point when getCoalescedEvents is unavailable.
```html
```
--------------------------------
### Element Pointer Capture Methods
Source: https://www.w3.org/TR/pointerevents3
These methods are extensions to the Element interface for setting, releasing, and checking pointer capture.
```APIDOC
## setPointerCapture(pointerId)
### Description
Sets pointer capture for the pointer identified by the argument `pointerId` to the element on which this method is invoked. For subsequent events of the pointer, the capturing target will substitute the normal hit testing result as if the pointer is always over the capturing target, and they MUST always be targeted at this element until capture is released. The pointer MUST be in its active buttons state for this method to be effective, otherwise it fails silently. When the provided method's argument does not match any of the active pointers, throw a "NotFoundError" DOMException.
### Method
setPointerCapture
### Parameters
- **pointerId** (long) - Required - The identifier of the pointer for which to set pointer capture.
### Exceptions
- **NotFoundError** - Thrown when the provided method's argument does not match any of the active pointers.
```
```APIDOC
## releasePointerCapture(pointerId)
### Description
Releases pointer capture for the pointer identified by the argument `pointerId` from the element on which this method is invoked. Subsequent events for the pointer follow normal hit testing mechanisms (out of scope for this specification) for determining the event target. When the provided method's argument does not match any of the active pointers, throw a "NotFoundError" DOMException.
### Method
releasePointerCapture
### Parameters
- **pointerId** (long) - Required - The identifier of the pointer for which to release pointer capture.
### Exceptions
- **NotFoundError** - Thrown when the provided method's argument does not match any of the active pointers.
```
```APIDOC
## hasPointerCapture(pointerId)
### Description
Indicates whether the element on which this method is invoked has pointer capture for the pointer identified by the argument `pointerId`. In particular, returns `true` if the pending pointer capture target override for `pointerId` is set to the element on which this method is invoked, and `false` otherwise. This method will return true immediately after a call to `setPointerCapture()`, even though that element will not yet have received a `gotpointercapture` event. As a result it can be useful for detecting implicit pointer capture from inside of a `pointerdown` event listener.
### Method
hasPointerCapture
### Parameters
- **pointerId** (long) - Required - The identifier of the pointer to check for pointer capture.
### Returns
- **boolean** - `true` if the element has pointer capture for the pointer, `false` otherwise.
```
--------------------------------
### PointerEvent constructor
Source: https://www.w3.org/TR/pointerevents3
The PointerEvent constructor allows creating a new PointerEvent instance.
```APIDOC
## PointerEvent constructor
### Description
Creates a new PointerEvent object with the specified type and initialization dictionary.
### Method
constructor
### Parameters
- **type** (DOMString) - Required - The type of the event.
- **eventInitDict** (PointerEventInit) - Optional - Initialization options for the event.
```
--------------------------------
### getCoalescedEvents()
Source: https://www.w3.org/TR/pointerevents3
The getCoalescedEvents() method returns a sequence of PointerEvent objects that were coalesced into the current event, providing more detailed input data.
```APIDOC
## [Method] getCoalescedEvents
### Description
Returns a sequence of coalesced PointerEvent objects that were coalesced into the current event.
### Method
GET
### Endpoint
pointerEvent.getCoalescedEvents()
### Parameters
None.
### Response
#### Success Response
Returns a sequence of PointerEvent objects.
#### Response Example
```js
[PointerEvent, PointerEvent, ...]
```
```
--------------------------------
### PointerEvent.getCoalescedEvents()
Source: https://www.w3.org/TR/pointerevents3
The getCoalescedEvents() method returns the coalesced events associated with the pointer event.
```APIDOC
## PointerEvent.getCoalescedEvents()
### Description
Returns a sequence of coalesced PointerEvent objects that were not dispatched as separate events.
### Method
getCoalescedEvents
### Parameters
None.
### Return Value
sequence - A list of coalesced events.
```
--------------------------------
### Pointer Capture Methods
Source: https://www.w3.org/TR/pointerevents3
Pointer capture methods for retargeting pointer events to a specific element.
```APIDOC
## setPointerCapture(pointerId)
### Description
Sets pointer capture for the specified pointer on the element, retargeting all subsequent pointer events (including compatibility mouse events) to this element.
### Method
setPointerCapture
### Parameters
- **pointerId** (long) - Required - The identifier of the active pointer to capture.
### Exceptions
- **NotFoundError** - Thrown if the pointerId does not match any active pointer.
- **InvalidStateError** - Thrown if the element is not connected or if the document has a locked element.
### Behavior
- If the pointer is not in the active buttons state or the document is not active, the capture is not set.
- Sets the pending pointer capture target override for the specified pointerId.
```
```APIDOC
## releasePointerCapture(pointerId)
### Description
Releases pointer capture for the specified pointer on the element, allowing events to be retargeted according to normal hit testing.
### Method
releasePointerCapture
### Parameters
- **pointerId** (long) - Required - The identifier of the active pointer to release.
### Exceptions
- **NotFoundError** - Thrown if the pointerId does not match any active pointer and the call is not an implicit release.
### Behavior
- If hasPointerCapture is false for the element, the method does nothing.
- Clears the pending pointer capture target override for the specified pointerId.
```
--------------------------------
### PointerEvent Interface
Source: https://www.w3.org/TR/pointerevents3
Documentation for the PointerEvent interface properties and methods as defined in the Pointer Events Level 3 specification.
```APIDOC
## PointerEvent Interface
### Description
The PointerEvent interface extends the standard event interface to provide information about pointer input devices such as mouse, pen, touch, and other pointing devices. This documentation covers the properties and methods defined in the Pointer Events Level 3 specification.
### Properties
#### tangentialPressure
- **Type**: double
- **Range**: [-1, 1]
- **Default**: 0
- **Description**: The normalized tangential pressure (also known as barrel pressure), typically set by an additional control (e.g., a finger wheel on an airbrush stylus). Some hardware may only support positive values in [0, 1]. For hardware that does not support tangential pressure, the value MUST be 0.
#### tiltX
- **Type**: double
- **Range**: [-90, 90] degrees
- **Default**: 0
- **Description**: The plane angle between the Y-Z plane and the plane containing both the transducer axis and the Y axis. A positive tiltX is to the right. For hardware that does not report tilt, the value MUST be 0.
#### tiltY
- **Type**: double
- **Range**: [-90, 90] degrees
- **Default**: 0
- **Description**: The plane angle between the X-Z plane and the plane containing both the transducer axis and the X axis. A positive tiltY is towards the user. For hardware that does not report tilt, the value MUST be 0.
#### twist
- **Type**: double
- **Range**: [0, 359] degrees
- **Default**: 0
- **Description**: The clockwise rotation of a transducer around its own major axis. For hardware that does not report twist, the value MUST be 0.
#### altitudeAngle
- **Type**: double
- **Range**: [0, π/2] radians
- **Default**: π/2
- **Description**: The altitude of the transducer, where 0 is parallel to the surface and π/2 is perpendicular. For hardware that does not report tilt, the value MUST be π/2.
#### azimuthAngle
- **Type**: double
- **Range**: [0, 2π] radians
- **Default**: 0
- **Description**: The azimuth angle of the transducer, where 0 represents the cap pointing in the direction of increasing X values. When the transducer is perpendicular, the value MUST be 0. For hardware that does not report tilt, the value MUST be 0.
#### pointerType
- **Type**: string
- **Values**: "mouse", "pen", "touch", or empty string
- **Description**: Indicates the device type that caused the event. If the device type cannot be detected, the value MUST be an empty string. Vendor-prefixed values SHOULD be used for other device types.
#### isPrimary
- **Type**: boolean
- **Description**: Indicates if the pointer represents the primary pointer of this pointer type.
### Methods
#### getCoalescedEvents()
- **Returns**: Array of PointerEvent objects
- **Description**: Returns the list of coalesced events for the pointer event.
```
--------------------------------
### PointerEvent constructor
Source: https://www.w3.org/TR/pointerevents3
The PointerEvent constructor creates a new PointerEvent instance with the specified type and optional initialization dictionary.
```APIDOC
## [Constructor] PointerEvent
### Description
Creates a new PointerEvent object with the given type and optional initialization dictionary.
### Method
Constructor
### Endpoint
new PointerEvent(type, eventInitDict)
### Parameters
#### Constructor Parameters
- **type** (DOMString) - Required - The type of the pointer event.
- **eventInitDict** (PointerEventInit) - Optional - Initialization dictionary with default values.
### Request Example
```js
const event = new PointerEvent('pointerdown', { pointerId: 1, width: 10, height: 10 });
```
### Response
#### Success Response
Returns a new PointerEvent object.
#### Response Example
```js
PointerEvent { isTrusted: false, pointerId: 1, width: 10, height: 10, ... }
```
```
--------------------------------
### GlobalEventHandlers mixin extensions
Source: https://www.w3.org/TR/pointerevents3
This snippet documents the WebIDL extensions to the GlobalEventHandlers mixin, listing all the event handler attributes for pointer events.
```APIDOC
## [WebIDL] GlobalEventHandlers mixin extensions
### Description
Extensions to the GlobalEventHandlers mixin to facilitate event handler registration for pointer events.
### Interface
partial interface mixin GlobalEventHandlers
### Attributes
- **onpointerover** (EventHandler) - Event handler IDL attribute for the `pointerover` event type.
- **onpointerenter** (EventHandler) - Event handler IDL attribute for the `pointerenter` event type.
- **onpointerdown** (EventHandler) - Event handler IDL attribute for the `pointerdown` event type.
- **onpointermove** (EventHandler) - Event handler IDL attribute for the `pointermove` event type.
- **onpointerrawupdate** (EventHandler) - [SecureContext] Event handler IDL attribute for the `pointerrawupdate` event type.
- **onpointerup** (EventHandler) - Event handler IDL attribute for the `pointerup` event type.
- **onpointercancel** (EventHandler) - Event handler IDL attribute for the `pointercancel` event type.
- **onpointerout** (EventHandler) - Event handler IDL attribute for the `pointerout` event type.
- **onpointerleave** (EventHandler) - Event handler IDL attribute for the `pointerleave` event type.
- **ongotpointercapture** (EventHandler) - Event handler IDL attribute for the `gotpointercapture` event type.
- **onlostpointercapture** (EventHandler) - Event handler IDL attribute for the `lostpointercapture` event type.
### Example
```webidl
partial interface mixin GlobalEventHandlers {
attribute EventHandler onpointerover;
attribute EventHandler onpointerenter;
attribute EventHandler onpointerdown;
attribute EventHandler onpointermove;
[SecureContext] attribute EventHandler onpointerrawupdate;
attribute EventHandler onpointerup;
attribute EventHandler onpointercancel;
attribute EventHandler onpointerout;
attribute EventHandler onpointerleave;
attribute EventHandler ongotpointercapture;
attribute EventHandler onlostpointercapture;
};
```
```
--------------------------------
### Intermediate parent disallowing direct manipulation with conflicting pan values
Source: https://www.w3.org/TR/pointerevents3
Demonstrates an intermediate parent with touch-action: pan-y and a child with touch-action: pan-x inside a scrollable container. Because the child allows only horizontal panning but an ancestor allows only vertical, no panning/zooming is handled by the user agent, so the child receives all pointer events.
```html
This element receives pointer events for all direct manipulation interactions because
it allows only horizontal panning yet an intermediate ancestor
(between it and the scrollable element) only allows vertical panning.
Therefore, no direct manipulation behaviors for panning/zooming are
handled by the user agent.
```
--------------------------------
### Convert between tiltX/tiltY and altitudeAngle/azimuthAngle
Source: https://www.w3.org/TR/pointerevents3
Provides two functions to convert between tiltX/tiltY and altitudeAngle/azimuthAngle. spherical2tilt converts from spherical coordinates to tilt values, handling boundary cases when altitudeAngle is 0. tilt2spherical converts from tilt values to spherical coordinates, handling boundary cases and returning azimuthAngle and altitudeAngle in radians.
```javascript
/* Converting between tiltX/tiltY and altitudeAngle/azimuthAngle */
function spherical2tilt(altitudeAngle, azimuthAngle) {
const radToDeg = 180/Math.PI;
let tiltXrad = 0;
let tiltYrad = 0;
if (altitudeAngle == 0) {
// the pen is in the X-Y plane
if (azimuthAngle == 0 || azimuthAngle == 2*Math.PI) {
// pen is on positive X axis
tiltXrad = Math.PI/2;
}
if (azimuthAngle == Math.PI/2) {
// pen is on positive Y axis
tiltYrad = Math.PI/2;
}
if (azimuthAngle == Math.PI) {
// pen is on negative X axis
tiltXrad = -Math.PI/2;
}
if (azimuthAngle == 3*Math.PI/2) {
// pen is on negative Y axis
tiltYrad = -Math.PI/2;
}
if (azimuthAngle>0 && azimuthAngleMath.PI/2 && azimuthAngleMath.PI && azimuthAngle<3*Math.PI/2) {
tiltXrad = -Math.PI/2;
tiltYrad = -Math.PI/2;
}
if (azimuthAngle>3*Math.PI/2 && azimuthAngle<2*Math.PI) {
tiltXrad = Math.PI/2;
tiltYrad = -Math.PI/2;
}
}
if (altitudeAngle != 0) {
const tanAlt = Math.tan(altitudeAngle);
tiltXrad = Math.atan(Math.cos(azimuthAngle) / tanAlt);
tiltYrad = Math.atan(Math.sin(azimuthAngle) / tanAlt);
}
return {"tiltX":tiltXrad*radToDeg, "tiltY":tiltYrad*radToDeg};
}
function tilt2spherical(tiltX, tiltY) {
const tiltXrad = tiltX * Math.PI/180;
const tiltYrad = tiltY * Math.PI/180;
// calculate azimuth angle
let azimuthAngle = 0;
if (tiltX == 0) {
if (tiltY > 0) {
azimuthAngle = Math.PI/2;
}
else if (tiltY < 0) {
azimuthAngle = 3*Math.PI/2;
}
} else if (tiltY == 0) {
if (tiltX < 0) {
azimuthAngle = Math.PI;
}
} else if (Math.abs(tiltX) == 90 || Math.abs(tiltY) == 90) {
// not enough information to calculate azimuth
azimuthAngle = 0;
} else {
// Non-boundary case: neither tiltX nor tiltY is equal to 0 or +-90
const tanX = Math.tan(tiltXrad);
const tanY = Math.tan(tiltYrad);
azimuthAngle = Math.atan2(tanY, tanX);
if (azimuthAngle < 0) {
azimuthAngle += 2*Math.PI;
}
}
// calculate altitude angle
let altitudeAngle = 0;
if (Math.abs(tiltX) == 90 || Math.abs(tiltY) == 90) {
altitudeAngle = 0
} else if (tiltX == 0) {
altitudeAngle = Math.PI/2 - Math.abs(tiltYrad);
} else if (tiltY == 0) {
altitudeAngle = Math.PI/2 - Math.abs(tiltXrad);
} else {
// Non-boundary case: neither tiltX nor tiltY is equal to 0 or +-90
altitudeAngle = Math.atan(1.0/Math.sqrt(Math.pow(Math.tan(tiltXrad),2) + Math.pow(Math.tan(tiltYrad),2)));
}
return {"altitudeAngle":altitudeAngle, "azimuthAngle":azimuthAngle};
}
```
--------------------------------
### PointerEventInit dictionary
Source: https://www.w3.org/TR/pointerevents3
The PointerEventInit dictionary is used to configure a PointerEvent when it is constructed.
```APIDOC
## PointerEventInit dictionary
### Description
Defines the initialization options for a PointerEvent object.
### Members
- **pointerId** (long) - Optional - The unique identifier of the pointer.
- **width** (double) - Optional - The width of the pointer's contact geometry.
- **height** (double) - Optional - The height of the pointer's contact geometry.
- **pressure** (float) - Optional - The normalized pressure of the pointer.
- **tangentialPressure** (float) - Optional - The normalized tangential pressure.
- **tiltX** (long) - Optional - The plane angle between the Y-Z plane and the plane containing the pointer.
- **tiltY** (long) - Optional - The plane angle between the X-Z plane and the plane containing the pointer.
- **twist** (long) - Optional - The clockwise rotation of the pointer around its main axis.
- **altitudeAngle** (double) - Optional - The angle between the pointer's axis and the X-Y plane.
- **azimuthAngle** (double) - Optional - The angle between the pointer's projection on the X-Y plane and the X axis.
- **pointerType** (DOMString) - Optional - The type of pointer (e.g., mouse, pen, touch).
- **isPrimary** (boolean) - Optional - Indicates whether the pointer is the primary pointer.
- **coalescedEvents** (sequence) - Optional - A list of coalesced events.
- **predictedEvents** (sequence) - Optional - A list of predicted events.
```
--------------------------------
### Child region disallowing direct manipulation with touch-action: none
Source: https://www.w3.org/TR/pointerevents3
Shows a scrollable parent with a child that disables direct manipulation (touch-action: none) and a sibling that allows the parent to consume interactions. Useful for creating regions that capture pointer events while allowing the parent to scroll elsewhere.
```html
This element receives pointer events for all direct manipulation interactions that otherwise lead to panning or zooming.
Direct manipulation interactions on this element MAY be consumed for manipulating the parent.
```
--------------------------------
### PointerEvent.getPredictedEvents()
Source: https://www.w3.org/TR/pointerevents3
The getPredictedEvents() method returns the predicted events for the pointer event.
```APIDOC
## PointerEvent.getPredictedEvents()
### Description
Returns a sequence of predicted PointerEvent objects that are expected to occur in the future.
### Method
getPredictedEvents
### Parameters
None.
### Return Value
sequence - A list of predicted events.
```
--------------------------------
### getPredictedEvents()
Source: https://www.w3.org/TR/pointerevents3
The getPredictedEvents() method returns a sequence of PointerEvent objects that are predicted to occur in the future, useful for low-latency interactions.
```APIDOC
## [Method] getPredictedEvents
### Description
Returns a sequence of predicted PointerEvent objects that are predicted to occur in the future.
### Method
GET
### Endpoint
pointerEvent.getPredictedEvents()
### Parameters
None.
### Response
#### Success Response
Returns a sequence of PointerEvent objects.
#### Response Example
```js
[PointerEvent, PointerEvent, ...]
```
```
--------------------------------
### Disallow all direct manipulation behaviors with touch-action: none
Source: https://www.w3.org/TR/pointerevents3
Sets touch-action to none on a div so it receives pointer events for all direct manipulation interactions that would otherwise cause panning or zooming. Useful for disabling default behaviors like panning and zooming on an element.
```html
This element receives pointer events for all direct manipulation interactions that otherwise lead to panning or zooming.
```
--------------------------------
### Drawing with getCoalescedEvents and getPredictedEvents
Source: https://www.w3.org/TR/pointerevents3
Use this pointermove handler to draw coalesced events and predicted events. It clears previously drawn predicted points, draws actual coalesced movements, then draws the current predicted points to reduce perceived latency. The predicted points are cleared on the next pointermove event.
```javascript
let predicted_points = [];
window.addEventListener("pointermove", function(event) {
// Clear the previously drawn predicted points.
for (let e of predicted_points.reverse()) {
clearPoint(e.pageX, e.pageY);
}
// Draw the actual movements that happened since the last received event.
for (let e of event.getCoalescedEvents()) {
drawPoint(e.pageX, e.pageY);
}
// Draw the current predicted points to reduce the perception of latency.
predicted_points = event.getPredictedEvents();
for (let e of predicted_points) {
drawPoint(e.pageX, e.pageY);
}
});
```
--------------------------------
### getPredictedEvents()
Source: https://www.w3.org/TR/pointerevents3
Method that returns the list of predicted events for a PointerEvent.
```APIDOC
## getPredictedEvents()
### Description
Returns the list of predicted events for a PointerEvent.
### Method
N/A (method call)
### Endpoint
N/A
### Parameters
None.
### Request Example
N/A
### Response
#### Success Response
- **predictedEvents** (list) - The list of predicted events.
#### Response Example
N/A
```
--------------------------------
### Element.setPointerCapture(pointerId)
Source: https://www.w3.org/TR/pointerevents3
The setPointerCapture() method on Element captures the pointer with the given ID.
```APIDOC
## Element.setPointerCapture(pointerId)
### Description
Sets pointer capture for the specified pointer, causing subsequent pointer events to be targeted at this element.
### Method
setPointerCapture
### Parameters
- **pointerId** (long) - Required - The identifier of the pointer to capture.
```
--------------------------------
### Allow horizontal panning only with touch-action: pan-x
Source: https://www.w3.org/TR/pointerevents3
Sets touch-action to pan-x to allow only horizontal panning. The element receives pointer events when the interaction is not a horizontal pan, enabling custom handling for other gestures.
```html
This element receives pointer events when not panning in the horizontal direction.
```
--------------------------------
### Navigator.maxTouchPoints
Source: https://www.w3.org/TR/pointerevents3
The maxTouchPoints attribute on Navigator provides the maximum number of simultaneous touch points.
```APIDOC
## Navigator.maxTouchPoints
### Description
Read-only attribute indicating the maximum number of simultaneous touch points supported by the device.
### Attribute
- **maxTouchPoints** (long) - The maximum number of touch points.
```
--------------------------------
### GlobalEventHandlers event handler attributes
Source: https://www.w3.org/TR/pointerevents3
These event handler attributes allow handling pointer events on elements.
```APIDOC
## GlobalEventHandlers event handler attributes
### Description
Event handler attributes for pointer events on elements.
### Attributes
- **onpointerover** (EventHandler) - Fired when a pointer moves over an element.
- **onpointerenter** (EventHandler) - Fired when a pointer enters the hit test boundaries of an element.
- **onpointerdown** (EventHandler) - Fired when a pointer becomes active.
- **onpointermove** (EventHandler) - Fired when a pointer changes coordinates.
- **onpointerrawupdate** (EventHandler) - Fired when a pointer changes coordinates without coalescing. (SecureContext)
- **onpointerup** (EventHandler) - Fired when a pointer is no longer active.
- **onpointercancel** (EventHandler) - Fired when a pointer is canceled.
- **onpointerout** (EventHandler) - Fired when a pointer moves out of an element.
- **onpointerleave** (EventHandler) - Fired when a pointer leaves the hit test boundaries of an element.
- **ongotpointercapture** (EventHandler) - Fired when an element receives pointer capture.
- **onlostpointercapture** (EventHandler) - Fired when an element loses pointer capture.
```
--------------------------------
### Element.releasePointerCapture(pointerId)
Source: https://www.w3.org/TR/pointerevents3
The releasePointerCapture() method on Element releases the capture of the given pointer.
```APIDOC
## Element.releasePointerCapture(pointerId)
### Description
Releases pointer capture for the specified pointer, allowing pointer events to target other elements.
### Method
releasePointerCapture
### Parameters
- **pointerId** (long) - Required - The identifier of the pointer to release.
```
--------------------------------
### Element.hasPointerCapture(pointerId)
Source: https://www.w3.org/TR/pointerevents3
The hasPointerCapture() method on Element checks if the element has captured the given pointer.
```APIDOC
## Element.hasPointerCapture(pointerId)
### Description
Returns a boolean indicating whether the element has pointer capture for the specified pointer.
### Method
hasPointerCapture
### Parameters
- **pointerId** (long) - Required - The identifier of the pointer to check.
### Return Value
boolean - True if the element has pointer capture for the pointer, false otherwise.
```
--------------------------------
### PointerEvent attributes
Source: https://www.w3.org/TR/pointerevents3
These read-only attributes expose the properties of a pointer event.
```APIDOC
## PointerEvent attributes
### Description
Read-only attributes that provide information about the pointer event.
### Attributes
- **pointerId** (long) - The unique identifier of the pointer.
- **width** (double) - The width of the pointer's contact geometry.
- **height** (double) - The height of the pointer's contact geometry.
- **pressure** (float) - The normalized pressure of the pointer.
- **tangentialPressure** (float) - The normalized tangential pressure.
- **tiltX** (long) - The plane angle between the Y-Z plane and the plane containing the pointer.
- **tiltY** (long) - The plane angle between the X-Z plane and the plane containing the pointer.
- **twist** (long) - The clockwise rotation of the pointer around its main axis.
- **altitudeAngle** (double) - The angle between the pointer's axis and the X-Y plane.
- **azimuthAngle** (double) - The angle between the pointer's projection on the X-Y plane and the X axis.
- **pointerType** (DOMString) - The type of pointer (e.g., mouse, pen, touch).
- **isPrimary** (boolean) - Indicates whether the pointer is the primary pointer.
```
=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.