diff options
| author | Masahiro FUJIMOTO <mfujimot@gmail.com> | 2022-01-01 11:58:36 +0900 |
|---|---|---|
| committer | Masahiro FUJIMOTO <mfujimot@gmail.com> | 2022-01-22 11:58:10 +0900 |
| commit | 9807afbd21e06ecb76199352deecf273ec4f9ec9 (patch) | |
| tree | 7abc4febda7bbc6f5a9c11418c837181cb6104a6 | |
| parent | bb2171ea77d0027d884b2ebf7c63ba2041293c06 (diff) | |
| download | translated-content-9807afbd21e06ecb76199352deecf273ec4f9ec9.tar.gz translated-content-9807afbd21e06ecb76199352deecf273ec4f9ec9.tar.bz2 translated-content-9807afbd21e06ecb76199352deecf273ec4f9ec9.zip | |
2021/11/05 時点の英語版に同期
| -rw-r--r-- | files/ja/web/api/mouseevent/movementx/index.md | 64 |
1 files changed, 64 insertions, 0 deletions
diff --git a/files/ja/web/api/mouseevent/movementx/index.md b/files/ja/web/api/mouseevent/movementx/index.md new file mode 100644 index 0000000000..9a5d727067 --- /dev/null +++ b/files/ja/web/api/mouseevent/movementx/index.md @@ -0,0 +1,64 @@ +--- +title: MouseEvent.movementX +slug: Web/API/MouseEvent/movementX +tags: + - API + - DOM + - DOM イベント + - MouseEvent + - MovementX + - プロパティ + - 読み取り専用 + - リファレンス + - mouse lock + - pointer lock +translation_of: Web/API/MouseEvent/movementX +browser-compat: api.MouseEvent.movementX +--- +{{APIRef("DOM Events")}} + +**`movementX`** は {{domxref("MouseEvent")}} インターフェイスの読み取り専用プロパティで、直前の {{domxref("Element/mousemove_event", "mousemove")}} イベントとこのイベントのマウスポインターの X 座標の差を示します。このプロパティの値は `currentEvent.movementX = currentEvent.screenX - previousEvent.screenX` のように計算されます。 + +## 値 + +数値です。 + +## 例 + +この例は `movementX` と {{domxref("MouseEvent.movementY", "movementY")}} を使用して、マウスの移動量を記録します。 + +### HTML + +```html +<p id="log">マウスを動かしてください。</p> +``` + +### JavaScript + +```js +function logMovement(event) { + log.insertAdjacentHTML('afterbegin', `移動量: ${event.movementX}, ${event.movementY}<br>`); + while (log.childNodes.length > 128) log.lastChild.remove() +} + +const log = document.getElementById('log'); +document.addEventListener('mousemove', logMovement); +``` + +### 結果 + +{{EmbedLiveSample("Example")}} + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- {{domxref("MouseEvent.movementY")}} +- {{domxref("MouseEvent")}} +- [ポインターロック](/ja/docs/Web/API/Pointer_Lock_API) |