Wednesday, February 22, 2012

Image roll over effect using JavaScript


This program will change image when you place your mouse pointer over image. 


Before image change
After image change
 

<html>
<head>
    <title>Untitled Page</title>
<script language=javascript>

function change1()
{
 document.getElementById("myimage").src="Desert.jpg";
 
}
function change2()
{

 document.getElementById("myimage").src="Chrysanthemum.jpg";

}

</script>
</head>

<body>
<form name="myform" method="post">
<img id="myimage" src="Chrysanthemum.jpg" onMouseOver="change1()" onMouseOut="change2()" height="200" width="200">
</form>
</body>
</html>

No comments:

Post a Comment