css如何实现鼠标经过时，换图片
<styletype="text/css">ul,li{padding:0;margin:0;overflow:hidden;}li{list-style:none;}i...
<style type="text/css">
ul,li{ padding:0; margin:0; overflow:hidden;}
li{ list-style:none;}
img{ border:0;}
.box{ width:440px;}
.box li{ float:left; width:100px; height:80px; margin-right:10px;}
li a:hover{
background:url(GotJobButton.png);
}
</style>
<body>
<ul class="box">
<li><a href="baidu.com"><img src="support.png" width="100" height="80" alt="" /></a></li>
<li><a href="baidu.com"><img src="support.png" width="100" height="80" alt="" /></a></li>
</ul>
</body>
问题：
如何实现鼠标经过时，换图片？ 展开
ul,li{ padding:0; margin:0; overflow:hidden;}
li{ list-style:none;}
img{ border:0;}
.box{ width:440px;}
.box li{ float:left; width:100px; height:80px; margin-right:10px;}
li a:hover{
background:url(GotJobButton.png);
}
</style>
<body>
<ul class="box">
<li><a href="baidu.com"><img src="support.png" width="100" height="80" alt="" /></a></li>
<li><a href="baidu.com"><img src="support.png" width="100" height="80" alt="" /></a></li>
</ul>
</body>
问题：
如何实现鼠标经过时，换图片？ 展开
3个回答
展开全部
看你是要求经过a标签还是li标签，都可以加上hover来实现，如果是a加背景把display:inline-table;
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
onmousein事件
onmouseout事件
onmouseout事件
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<script language="javascript">
<!--
var src1="http://鼠标移开时的图片地址.jpg";
var src2="http://鼠标移上去时的图片地址.jpg";
function imgLoad(imgSrc){img1.src=imgSrc;/*return imgSrc;*/}
function imgSwap(imgObj){imgObj.src=(imgObj.src==src1)?src2:src1;}
//-->
</script>
<img id="img1" src="http://鼠标移开时的图片地址.jpg" onmouseover="imgSwap(this);" onmouseout="imgSwap(this);" >
<!--
var src1="http://鼠标移开时的图片地址.jpg";
var src2="http://鼠标移上去时的图片地址.jpg";
function imgLoad(imgSrc){img1.src=imgSrc;/*return imgSrc;*/}
function imgSwap(imgObj){imgObj.src=(imgObj.src==src1)?src2:src1;}
//-->
</script>
<img id="img1" src="http://鼠标移开时的图片地址.jpg" onmouseover="imgSwap(this);" onmouseout="imgSwap(this);" >
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
