JavaScript Link Object : onmouseout Event handler
Description
The onmouseout event handler of a link object can be defined in a piece of text, image or predefined area. It executes some JavaScript code or function when the pointing device (for example mouse) moved away from a link object.
Version
Implemented in JavaScript 1.1
Syntax
onmouseout = "JavascriptCode"
Parameter
JavascriptCode : JavaScript statement or JavaScript function.
Example of Link object : onmouseout event handler
In the following web document onmouseout event handler executes an alert box when a mouse moves away from a link object.
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>JavaScript Link Object's Event handler : onmouseout Example</title>
</head>
<body>
<h1 style="color: red">JavaScript Link Object's Event handler : onmouseout</h1>
<h3>Position the mouse pointer over the link (Google), then move the mouse pointer away from it and see the
link color is changed ....</h3>
<hr />
<script type="text/javascript">
//This is done to make the following JavaScript code compatible to XHTML. <![CDATA[
function mouseouteffect()
{
document.links[0].style.color='#4B7207';
}
//]]>
</script>
<form name="form1" action="#">
<a href="http://www.google.com"
onmouseout='mouseouteffect()'>
Google</a>
</form>
</body>
</html>
View the example of link object's onmouseout event handler in the browser
Practice link object's onmouseout event handler with Online Editor
Supported Browser
| Internet Explorer 7 | Firefox 3.6 | Google Chrome 7 | Safari 5.0.1 | Opera 10 |
| Yes | Yes | Yes | Yes | Yes |
See also :
Please Google+, Like this tutorial on FaceBook, Tweet, save it as bookmark and subscribe with our Feed. Have suggestions? comment using Disqus down this page. Thanks.
