A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://www.geeksforgeeks.org/html/html-onmouseout-event-attribute/ below:

HTML onmouseout Event Attribute - GeeksforGeeks

HTML onmouseout Event Attribute

Last Updated : 11 Jul, 2025

The HTML  onmouseout event attribute works when the mouse pointer moves out of the specified element. It activates when the mouse pointer moves out of an HTML element.

When a user moves the mouse away, this can be utilized to activate specific actions or functions and enables dynamic changes in response to mouse interactions, enhancing user experience.

Syntax:
<element onmouseout = "script">
Supported Tags:

It supports all HTML elements EXCEPT- 

Attribute value:

This attribute contains a single value script that works when the mouse moves out from the element. 

Example 1:

This example uses onmouseout event to display an alert message when the mouse moves out from the paragraph element. 

HTML
<!DOCTYPE html>
<html>

<body>
    <center>
        <h2>
            onmouseout Event Attribute
        </h2>

        <!-- onmouseout event call here -->
      
        <p onmouseout="geeks()">
            Computer science portal
        </p>
    </center>

    <script>
      
        /* Script run when onmouseout 
                event call */
      
        function geeks() {
            alert("Mouse move out");
        } 
    </script>
</body>

</html>

Output:

Output Example 2:

This example uses the onmouseout event to change the color of the text to yellow and the background color to black.

HTML
<!DOCTYPE html>
<html>

<body>
    <script>
      
        /* Script run when onmouseout event call */
      
        function geeks() {
            document.getElementById('gfg').
                style.color = 'yellow'
            document.getElementById('gfg').
                style.backgroundColor = 'black'
        } 
    </script>
    </head>

    <center>
        <h2>
            onmouseout Event Attribute
        </h2>

        <!-- onmouseout event call here -->
      
        <p id="gfg" onmouseout="geeks()">
            Computer science portal
        </p>
    </center>
</body>

</html>

Output:

Output

We have a list of  JavaScript onmouse events, to check those please go through the JavaScript onmouse events article.

Supported Browser:

We have a Cheat Sheet on Javascript where we covered all the important topics of Javascript to check those please go through Javascript Cheat Sheet-A Basic guide to JavaScript.



RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4