如何在鼠标悬停时更改图标

时间:2013-03-15 13:19:48

标签: image mouse

我刚在html上添加了这样的图片。

<img src="Your image address" width="500" height="500">

但我想在鼠标光标出现在图像上时添加鼠标,然后图像应该更改,我在这里使用了什么代码。感谢

1 个答案:

答案 0 :(得分:0)

文件层次结构:Vidzpra / index.html和Vidzpra / images有两个图像black.jpg和yellow.jpg 这是用于在鼠标上更改图像的代码(带有内部javascript的HTML):

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>onMouserOver Img change</title>

<script>
    function changeImg(el){
        el.src  = "images/yellow.jpg";
    }

    function fixImg(el){
        el.src = "images/black.jpg";
    }

</script>
</head>

<body>
    <div>
        <img onmouseover="changeImg(this)" onmouseout="fixImg(this)" border="0" src="images/black.jpg" alt="" align="middle" >
    </div>
</body>

</html>