Create A HTML Page With Rollover With A Mouse Events When We Enter The Mouse In Image .Image Should Be Change To Another Image And When We Mouse Out From Image Previous Image Should Be Display
Code Start Here
Hover.html
<html>
<head>
<title>Rollover with a Mouse Events</title>
<script type="text/javascript">
if(document.images){
var image1 = new Image(); // Preload an image
image1.src = "turndown.gif";
var image2 = new Image(); // Preload second image
image2.src = "nit.gif";
}
</script>
</head>
<body>
<p>Move your mouse over the image to see the result</p>
<a href="#" onMouseOver="document.myImage.src=image2.src;" onMouseOut="document.myImage.src=image1.src;">
<img name="myImage" src="nit.gif" />
</a>
</body>
</html>
Output:-
Before Enter A Mouse In Image
Code Start Here
Hover.html
<html>
<head>
<title>Rollover with a Mouse Events</title>
<script type="text/javascript">
if(document.images){
var image1 = new Image(); // Preload an image
image1.src = "turndown.gif";
var image2 = new Image(); // Preload second image
image2.src = "nit.gif";
}
</script>
</head>
<body>
<p>Move your mouse over the image to see the result</p>
<a href="#" onMouseOver="document.myImage.src=image2.src;" onMouseOut="document.myImage.src=image1.src;">
<img name="myImage" src="nit.gif" />
</a>
</body>
</html>
Output:-
Before Enter A Mouse In Image
After Enter Mouse In Image
0 Comments: