<ul id="menu">
<li><a href="./"><img src="images/menu_index.jpg" alt="首页" /></a></li>
<li><a href="about.php"><img src="images/menu_about.jpg" alt="关于我们" /></a></li>
<li><a href="contact.php"><img src="images/menu_about.jpg" alt="联系我们" /></a></li>
</ul>
鼠标移上时变换图片,图片名称是在原图片名称后加"_on",如"menu_index_on.jpg"。
用JQuery方法,在线求!
或者如果有更好的方案,建议下,多芬!jQuery
<li><a href="./"><img src="images/menu_index.jpg" alt="首页" /></a></li>
<li><a href="about.php"><img src="images/menu_about.jpg" alt="关于我们" /></a></li>
<li><a href="contact.php"><img src="images/menu_about.jpg" alt="联系我们" /></a></li>
</ul>
鼠标移上时变换图片,图片名称是在原图片名称后加"_on",如"menu_index_on.jpg"。
用JQuery方法,在线求!
或者如果有更好的方案,建议下,多芬!jQuery
<ul id="menu">
<li><a href="./"><img src="images/menu_index.jpg" alt="首页" /></a></li>
<li><a href="about.php"><img src="images/menu_about.jpg" alt="关于我们" /></a></li>
<li><a href="contact.php"><img src="images/menu_contact.jpg" alt="联系我们" /></a></li>
</ul>
<html>
<head>
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script type="text/javascript">
function dohover(elem){
var path = $(elem).attr("src");
var newPath = path.replace('.jpg', '') + "_on.jpg";
$(elem).attr("src", newPath);
}
</script>
</head>
<body>
<ul id="menu">
<li><a href="./"><img src="images/menu_index.jpg" alt="首页" onMouseover="dohover(this)" /></a></li>
<li><a href="about.php"><img src="images/menu_about.jpg" alt="关于我们" /></a></li>
<li><a href="contact.php"><img src="images/menu_about.jpg" alt="联系我们" /></a></li>
</ul>
</body>
<html>最懒的写法
直接在img上添加事件, 找到src属性, 进行字符串替换