onmouseleaveEvent
Event ObjectExamples
Execute JavaScript when the mouse pointer leaves the element:
Try it »
In the more examples below, click "Try it" to see more demos.
Definition and Usage
The onmouseleave event fires when the mouse leaves the element.
Tip:This event is usually used together withonmouseenterthe event, which is triggered when the mouse moves over the element.
Tip:The onmouseleave event is similar toonmouseoutthe event. The only difference is that the onmouseleave event does not support bubbling.
Browser Support
The numbers in the table specify the first browser version that supports the event.
| Event | |||||
|---|---|---|---|---|---|
| onmouseleave | 30.0 | 5.5 | Yes | 6.1 | 11.5 |
Syntax
In HTML:
In JavaScript:
In JavaScript, using the addEventListener() method:
Note:Internet Explorer 8 and earlier IE versions do not supportaddEventListener()method.
Technical Details
| Bubbles: | No |
|---|---|
| Cancelable: | No |
| Event type: | MouseEvent |
| Supported HTML tags: | All HTML elements, except: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, and <title> |
More Examples
Example
This example demonstrates the difference between the onmousemove, onmouseleave and onmouseout events:
<p id="demo">I will demonstrate onmousemove!</p>
</div>
<div onmouseleave="myLeaveFunction()">
<p id="demo2">I will demonstrate onmouseleave!</p>
</div>
<div onmouseout="myOutFunction()">
<p id="demo3">I will demonstrate onmouseout!</p>
</div>
Try it »