GlobalEventHandlers.onmouseover

The onmouseover property of the GlobalEventHandlers mixin is an event handler that processes mouseover events.

The mouseover event fires when the user moves the mouse over a particular element.

Syntax

element.onmouseover = function;

Example

This example adds an onmouseover and an onmouseout event to a paragraph. Try moving your mouse over and out of the element.

HTML

<p>Test your mouse on me!</p>

JavaScript

const p = document.querySelector('p');
p.onmouseover = logMouseOver;
p.onmouseout = logMouseOut;

function logMouseOver() {
  p.textContent = 'MOUSE OVER detected';
}

function logMouseOut() {
  p.textContent = 'MOUSE OUT detected';
}

Result

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
onmouseover
1
12
9
4
≤12.1
1
1
18
9
≤12.1
1
1.0

© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onmouseover