How to change images on mouse hover using javascript | mouse hover events
How to change images on mouse hover using javascript | mouse hover events
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Test Page</title>
</head>
<body>
<img id="photo" onmouseover="box3()" onmouseout="box4()" src="1.png" width="200px" height="100px" > //remember to change source of photo
<script>
function box3()
{
document.getElementById("photo").src="2.jpg"; //remember to change source of photo
}
function box4()
{
document.getElementById("photo").src="1.png"; //remember to change source of photo
}
</script>
Here is how the output looks like :
Comments
Post a Comment
I WOULD APPRECIATE IF YOU LEAVE A COMMENT OR YOUR FEEDBACK HERE !!!