MouseEvent.movementX

The movementX read-only property of the MouseEvent interface provides the difference in the X coordinate of the mouse pointer between the given event and the previous mousemove event. In other words, the value of the property is computed like this: currentEvent.movementX = currentEvent.screenX - previousEvent.screenX.

Syntax

var xShift = instanceOfMouseEvent.movementX;

Return value

A number

Example

This example logs the amount of mouse movement using movementX and movementY.

HTML

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

JavaScript

function logMovement(event) {
  log.insertAdjacentHTML('afterbegin', `movement: ${event.movementX}, ${event.movementY}<br>`);
  while (log.childNodes.length > 128) log.lastChild.remove()
}

const log = document.getElementById('log');
document.addEventListener('mousemove', logMovement);

Result

Specifications

Specification Status Comment
Pointer Lock
The definition of 'MouseEvent.movementX' in that specification.
Candidate Recommendation Initial definition

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
movementXChrome Full support 37
Full support 37
No support 22 — 37
Prefixed
Prefixed Implemented with the vendor prefix: webkit
Edge Full support 13Firefox Full support 41
Full support 41
No support 1 — 41
Prefixed
Prefixed Implemented with the vendor prefix: moz
IE No support NoOpera Full support YesSafari No support NoWebView Android Full support 37
Full support 37
No support ? — 37
Prefixed
Prefixed Implemented with the vendor prefix: webkit
Chrome Android Full support 37
Full support 37
No support ? — 37
Prefixed
Prefixed Implemented with the vendor prefix: webkit
Firefox Android Full support 41
Full support 41
No support 4 — 41
Prefixed
Prefixed Implemented with the vendor prefix: moz
Opera Android Full support YesSafari iOS No support NoSamsung Internet Android Full support Yes

Legend

Full support  
Full support
No support  
No support
Requires a vendor prefix or different name for use.
Requires a vendor prefix or different name for use.

See also