when I set the content of function to "alert();", It recognizes when I hover the image. When I implement what I wants it do, which is hover another image over the original picture. Nothing happens? If anyone could some guidance I'd appreciate it.
<script type="text/javascript">
function SetNewImage()
{
document.getElementById("thumbnail").src="images/art/thumbs/06010.jpg";
}
function SetOldImage()
{
document.getElementById("thumbnail").src="images/art/thumbs/05030.jpg";
}
</script>
</head>
<body>
<img class="thumbnail" onmouseover="SetNewImage()" onmouseout="SetOldImage()" src="images/art/thumbs/05030.jpg" alt="Death of Marat" class="artThumb"/>
</body>
you use document.getElement by id But id not founfd
<img id="thumbnail" onmouseover="SetNewImage()" onmouseout="SetOldImage()" src="images/art/thumbs/05030.jpg" alt="Death of Marat" class="artThumb"/>
you can try this -
<script type="text/javascript">
function SetNewImage()
{
document.getElementById("thumbnail").src="images/art/thumbs/06010.jpg";
}
function SetOldImage()
{
document.getElementById("thumbnail").src="images/art/thumbs/05030.jpg";
}
</script>
</head>
<body>
<img class="thumbnail" onmouseover="SetNewImage()" onmouseout="SetOldImage()" src="images/art/thumbs/05030.jpg" alt="Death of Marat" class="artThumb"/>
</body>
use this.src=imgUrl variable to solve your problem
try modify class to id, Class in the img and getelementbyid in JS