HTML Reference Manual

HTML Tag List

HTML onmouseover event attribute

The onmouseover attribute is used to get or set the event handler function for the current element's mouseover event

Online Example

Script runs when the mouse pointer is over the image:

Example

<!DOCTYPE html>
<html>
<head>
<title>Use of HTML onmouseover Event Attribute (Basic Tutorial Website oldtoolbag.com)</title>
</head>
<body>
<img onmouseover="bigImg(this)" onmouseout="normalImg(this)" border="0" src="pig.gif" alt="pig" width="32" height="32">
<p>When the user hovers the mouse over the image, the bigImg() function will be triggered. This function enlarges the image.
When the mouse pointer leaves the image, the normalImg() function will be triggered. This function sets the height and width of the image to normal.</p>
<script>
function bigImg(x) {
　　x.style.height = ""64px";
　　x.style.width = ""64px";
}
function normalImg(x) {
　　x.style.height = ""32px";
　　x.style.width = ""32px";
}
</script>
</body>
</html>

Test See ‹/›

Browser Compatibility

IEFirefoxOperaChromeSafari

All major browsers support the onmouseover event attribute

Definition and Usage

The onmouseover attribute is triggered when the mouse pointer is moved over an element.

Tip: The onmouseover attribute is usually used withonmouseoutattributes together.

Note: The onmouseover attribute cannot be used with the following elements: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, or <title>.

HTML 4.01 with HTML5differences

None.

Syntax

<element onmouseover="script">

Attribute Value

Value	Description
script	Specifies the script to be executed when the onmouseover event is triggered.

HTML Event Attributes

HTML: <template> tag