The pointerout event is fired for several reasons including: pointing device is moved out of the hit test boundaries of an element; firing the pointercancel); when a pen stylus leaves the hover range detectable by the digitizer.

pointerout events have the same problems as addEventListener(), or set an event handler property.

addEventListener("pointerout", (event) => {});

onpointerout = (event) => {};

Event type

A Event.

Event properties

This interface inherits properties from Event.

PointerEvent.altitudeAngle Read only Experimental: Represents the angle between a transducer (a pointer or stylus) axis and the X-Y plane of a device screen.
PointerEvent.azimuthAngle Read only Experimental: Represents the angle between the Y-Z plane and the plane containing both the transducer (a pointer or stylus) axis and the Y axis.
PointerEvent.persistentDeviceId Read only Experimental: A unique identifier for the pointing device generating the PointerEvent.
PointerEvent.pointerId Read only: A unique identifier for the pointer causing the event.
PointerEvent.width Read only: The width (magnitude on the X axis), in CSS pixels, of the contact geometry of the pointer.
PointerEvent.height Read only: The height (magnitude on the Y axis), in CSS pixels, of the contact geometry of the pointer.
PointerEvent.pressure Read only: The normalized pressure of the pointer input in the range 0 to 1, where 0 and 1 represent the minimum and maximum pressure the hardware is capable of detecting, respectively.
PointerEvent.tangentialPressure Read only: The normalized tangential pressure of the pointer input (also known as barrel pressure or cylinder stress) in the range -1 to 1, where 0 is the neutral position of the control.
PointerEvent.tiltX Read only: The plane angle (in degrees, in the range of -90 to 90) between the Y–Z plane and the plane containing both the pointer (e.g. pen stylus) axis and the Y axis.
PointerEvent.tiltY Read only: The plane angle (in degrees, in the range of -90 to 90) between the X–Z plane and the plane containing both the pointer (e.g. pen stylus) axis and the X axis.
PointerEvent.twist Read only: The clockwise rotation of the pointer (e.g. pen stylus) around its major axis in degrees, with a value in the range 0 to 359.
PointerEvent.pointerType Read only: Indicates the device type that caused the event (mouse, pen, touch, etc.).
PointerEvent.isPrimary Read only: Indicates if the pointer represents the primary pointer of this pointer type.

Examples

Using addEventListener():

const para = document.querySelector("p");

para.addEventListener("pointerout", (event) => {
  console.log("Pointer moved out");
});

Using the onpointerout event handler property:

const para = document.querySelector("p");

para.onpointerout = (event) => {
  console.log("Pointer moved out");
};

Specifications

Specification
Pointer Events # dom-globaleventhandlers-onpointerout

Browser compatibility

BCD tables only load in the browser

Event type

Event properties

Examples

Specifications

Browser compatibility

See also