Element: pointermove Event
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2020.
Das pointermove
-Ereignis wird ausgelöst, wenn ein Zeiger die Koordinaten ändert und der Zeiger nicht von einer Browser-touch-action abgebrochen wurde. Es ist dem mousemove
Ereignis sehr ähnlich, aber mit mehr Funktionen.
Diese Ereignisse treten unabhängig davon auf, ob irgendwelche Zeigertasten gedrückt sind. Sie können mit sehr hoher Frequenz ausgelöst werden, was davon abhängt, wie schnell der Benutzer den Zeiger bewegt, wie schnell die Maschine ist, welche anderen Aufgaben und Prozesse ausgeführt werden, usw.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener()
oder setzen Sie eine Ereignis-Handler-Eigenschaft.
addEventListener("pointermove", (event) => { })
onpointermove = (event) => { }
Ereignistyp
Ein PointerEvent
. Erbt von Event
.
Ereigniseigenschaften
Diese Schnittstelle erbt Eigenschaften von MouseEvent
und Event
.
PointerEvent.altitudeAngle
Schreibgeschützt Experimentell-
Stellt den Winkel zwischen der Achse eines Transducers (einem Zeiger oder Stylus) und der X-Y-Ebene eines Gerätescreens dar.
PointerEvent.azimuthAngle
Schreibgeschützt Experimentell-
Stellt den Winkel zwischen der Y-Z-Ebene und der Ebene dar, die sowohl die Achse des Transducers (einem Zeiger oder Stylus) als auch die Y-Achse enthält.
PointerEvent.persistentDeviceId
Schreibgeschützt Experimentell-
Eine eindeutige Kennung für das Zeigegerät, das das
PointerEvent
erzeugt. PointerEvent.pointerId
Schreibgeschützt-
Eine eindeutige Kennung für den Zeiger, der das Ereignis verursacht.
PointerEvent.width
Schreibgeschützt-
Die Breite (Größe auf der X-Achse) in CSS-Pixeln der Kontaktgeometrie des Zeigers.
PointerEvent.height
Schreibgeschützt-
Die Höhe (Größe auf der Y-Achse) in CSS-Pixeln der Kontaktgeometrie des Zeigers.
PointerEvent.pressure
Schreibgeschützt-
Der normalisierte Druck des Zeigereingangs im Bereich von
0
bis1
, wobei0
und1
den minimalen und maximalen Druck darstellen, den die Hardware erkennen kann. PointerEvent.tangentialPressure
Schreibgeschützt-
Der normalisierte tangentiale Druck des Zeigereingangs (auch bekannt als Fassdruck oder Zylinder-Spannung) im Bereich von
-1
bis1
, wobei0
die neutrale Position der Steuerung ist. PointerEvent.tiltX
Schreibgeschützt-
Der Winkel der Ebene (in Grad, im Bereich von
-90
bis90
) zwischen der Y-Z-Ebene und der Ebene, die sowohl die Zeigerachse (z.B. Stift-Stylus) als auch die Y-Achse enthält. PointerEvent.tiltY
Schreibgeschützt-
Der Winkel der Ebene (in Grad, im Bereich von
-90
bis90
) zwischen der X-Z-Ebene und der Ebene, die sowohl die Zeigerachse (z.B. Stift-Stylus) als auch die X-Achse enthält. PointerEvent.twist
Schreibgeschützt-
Die Drehung im Uhrzeigersinn des Zeigers (z.B. Stift-Stylus) um seine Hauptachse in Grad, mit einem Wert im Bereich von
0
bis359
. PointerEvent.pointerType
Schreibgeschützt-
Gibt den Gerätetyp an, der das Ereignis verursacht hat (Maus, Stift, Touch, etc.).
PointerEvent.isPrimary
Schreibgeschützt-
Gibt an, ob der Zeiger den primären Zeiger dieses Zeigertyps darstellt.
Verwendungshinweise
Das Ereignis vom Typ PointerEvent
liefert alle Informationen, die Sie über die Interaktion des Benutzers mit dem Zeigegerät wissen müssen, einschließlich der Position, Bewegungsdistanz, Tastenstatus und vieles mehr.
Beispiele
Um einen Handler für pointermove
-Ereignisse unter Verwendung von addEventListener()
hinzuzufügen:
const para = document.querySelector("p");
para.addEventListener("pointermove", (event) => {
console.log("Pointer moved");
});
Sie können auch die onpointermove
-Ereignis-Handler-Eigenschaft verwenden:
const para = document.querySelector("p");
para.onpointermove = (event) => {
console.log("Pointer moved");
};
Spezifikationen
Specification |
---|
Pointer Events> # the-pointermove-event> |
Pointer Events> # dom-globaleventhandlers-onpointermove> |
Browser-Kompatibilität
Loading…