MouseEvent: movementX property
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Thuộc tính movementX chỉ đọc của giao diện MouseEvent cung cấp sự khác biệt về tọa độ X của chuột (hoặc con trỏ) giữa sự kiện di chuyển đã cho và sự kiện di chuyển trước đó cùng loại.
Nói cách khác, giá trị của thuộc tính được tính như sau: currentEvent.movementX = currentEvent.screenX - previousEvent.screenX.
Giá trị bằng 0 cho tất cả các sự kiện ngoài mousemove, pointermove và pointerrawupdate.
Warning:
Trình duyệt sử dụng các đơn vị khác nhau cho movementX và screenX so với thông số kỹ thuật xác định.
Tùy thuộc vào trình duyệt và hệ điều hành, đơn vị movementX có thể là pixel vật lý, pixel logic hoặc pixel CSS. Bạn có thể muốn tránh các thuộc tính chuyển động và thay vào đó tính toán delta giữa các giá trị máy khách hiện tại (screenX, screenY) và các giá trị máy khách trước đó.
Giá trị
Một con số.
Luôn bằng 0 trên bất kỳ MouseEvent nào ngoài mousemove và bất kỳ PointerEvent nào ngoài pointermove hoặc pointerrawupdate.
Ví dụ
Ghi lại chuyển động của chuột cho các sự kiện mousemove
Ví dụ này ghi lại lượng di chuyển của chuột bằng movementX và movementY.
HTML
<p id="log">Move your mouse around.</p>
JavaScript
const log = document.getElementById("log");
function logMovement(event) {
log.insertAdjacentHTML(
"afterbegin",
`movement: ${event.movementX}, ${event.movementY}<br>`,
);
while (log.childNodes.length > 128) log.lastChild.remove();
}
document.addEventListener("mousemove", logMovement);
Kết quả
Thông số kỹ thuật
| Specification |
|---|
| Pointer Lock 2.0 # dom-mouseevent-movementx |