JavaScript Link Object : onmouseover Event handler
Description
The onmouseover 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) is moved over an link object.
Version
Implemented in JavaScript 1.0
Syntax
onmouseover = "JavascriptCode"
Parameter
JavascriptCode : JavaScript statement or JavaScript function.
Example of Link object : onmouseover event handler
In the following web document onmouseover event handler executes an alert box when a mouse is moves over an link object.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"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 : onmouseover Example</title>
</head>
<body>
<h1 style="color: red">JavaScript Link Object's Event handler : onmouseover</h1>
<h3>Move the mouse pointer over the link (Google) 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 mouseovereffect()
{
document.links[0].style.color='#F00207';
}
//]]>
</script>
<form name="form1" action = "#">
<a href="http://www.google.com"
onmouseover = 'mouseovereffect()'>
Google</a>
</form>
</body>
</html>
View the example of link object's onmouseover event handler in the browser
Supported Browser
| Internet Explorer 7 | Firefox 3.6 | Google Chrome 7 | Safari 5.0.1 | Opera 10 |
| Yes | Yes | Yes | Yes | Yes |
See also :
