The onmouseover property returns the onMouseOver event handler code on the current element.


element.onmouseover = event handling code


<!doctype html>  
<title>onmouseover/onmouseout event example</title>  
<script type="text/javascript">  
    function initElement()  
        var p = document.getElementById("foo");  

        p.onmouseover = showMouseOver;
        p.onmouseout = showMouseOut;

    function showMouseOver()  
        var notice = document.getElementById("notice");
        notice.innerHTML = 'mouse over detected';
    function showMouseOut()
        var notice = document.getElementById("notice");
        notice.innerHTML = 'mouse out detected';

<style type="text/css">  
    #foo {  
    border: solid blue 2px;  
<body onload="initElement();">  
    <span id="foo">My Event Element</span>
    <p>move your mouse over and out the above element.</p>  
    <div id="notice"></div>


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


Specification Status Comment
WHATWG HTML Living Standard
The definition of 'onmouseover' in that specification.
Living Standard  

Document Tags and Contributors

 Last updated by: cvrebert,