Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

Element: pointermove-Ereignis

Baseline
Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2020 browserübergreifend verfügbar.

Das pointermove-Ereignis wird ausgelöst, wenn ein Zeiger die Koordinaten ändert und der Zeiger nicht durch eine Browser-touch-action abgebrochen wurde. Das Ereignis tritt ebenfalls auf, wenn ein Zeiger eine seiner anderen Eigenschaften ändert, vorausgesetzt, die Änderung löst kein anderes Zeigerereignis aus. Dies schließt jede Änderung des Drucks, des tangentialen Drucks, der Neigung, der Drehung, der Kontaktgeometrie (Breite und Höhe) oder der verketteten Tasten ein.

Das pointermove-Ereignis kann zusammengefasste Ereignisse haben, wenn bereits ein anderes pointermove-Ereignis mit derselben Zeiger-ID vorhanden ist, das noch nicht in der Ereignisschleife verarbeitet wurde. Wenn Ereignisse zusammengefasst sind, ist das target des ausgelösten Ereignisses dasselbe wie das letzte zusammengefasste. Weitere Informationen zu zusammengefassten Ereignissen finden Sie in der Dokumentation zu PointerEvent.getCoalescedEvents().

Dieses Ereignis ist dem mousemove-Ereignis sehr ähnlich, bietet jedoch mehr Funktionen. Diese Ereignisse treten unabhängig davon auf, ob Zeigertasten gedrückt sind oder nicht. Sie können mit sehr hoher Rate ausgelöst werden, abhängig davon, wie schnell der Benutzer den Zeiger bewegt, wie schnell die Maschine ist, welche anderen Aufgaben und Prozesse ausgeführt werden, etc.

Der Unterschied zwischen pointerrawupdate und pointermove liegt in ihrer Auslösefrequenz. Ein Browser kann pointermove-Ereignisse verzögern, um die Leistung zu verbessern, während pointerrawupdate-Ereignisse so schnell und häufig wie möglich vom Browser gesendet werden. Für die meisten Anwendungsfälle sollten Sie pointermove bevorzugen, um Leistungsprobleme zu vermeiden.

Syntax

Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder setzen Sie eine Ereignis-Handler-Eigenschaft.

js
addEventListener("pointermove", (event) => { })

onpointermove = (event) => { }

Ereignistyp

Ein PointerEvent. Erbt von Event.

Event UIEvent MouseEvent PointerEvent

Nutzungshinweise

Das Ereignis, welches vom Typ PointerEvent ist, bietet alle Informationen, die Sie über die Interaktion des Benutzers mit dem Zeigegerät wissen müssen, einschließlich der Position, der Bewegungsdistanz, der Tastenzustände und vielem mehr.

Beispiele

Um einen Handler für pointermove-Ereignisse mithilfe von addEventListener() hinzuzufügen:

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

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

Sie können auch die onpointermove-Ereignis-Handler-Eigenschaft verwenden:

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

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

Spezifikationen

Spezifikation
Pointer Events
# pointermove
Pointer Events
# dom-globaleventhandlers-onpointermove

Browser-Kompatibilität

Siehe auch