MouseEvent: movementX 屬性

可用性有限

此特性不是基線特性,因為它在一些最廣泛使用的瀏覽器中不起作用。

MouseEvent 介面的只讀屬性 movementX 提供了給定事件與上一個 mousemove 事件之間滑鼠指標 X 座標的差值。換句話說,該屬性的值計算如下:currentEvent.movementX = currentEvent.screenX - previousEvent.screenX

警告: 瀏覽器 使用的 movementXscreenX 單位與規範定義的單位不同。根據瀏覽器和作業系統,movementX 的單位可能是物理畫素、邏輯畫素或 CSS 畫素。您可能希望避免使用 movement 屬性,而是計算當前客戶端值(screenX, screenY)與先前客戶端值之間的差值。

一個數字。除 mousemove 事件外,所有 MouseEvent 事件均始終為零。

示例

此示例使用 movementXmovementY 記錄滑鼠移動量。

HTML

html
<p id="log">Move your mouse around.</p>

JavaScript

js
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);

結果

規範

規範
指標鎖定 2.0
# dom-mouseevent-movementx

瀏覽器相容性

另見