css鼠标悬停图片更换?
原来是这样的:图片链接<ahref="1.ASP"style="cursor:pointer"><imgsrc="images/1_a.gif"name="Image14...
原来是这样的:图片链接
<a href="1.ASP" style="cursor:pointer">
<img src="images/1_a.gif" name="Image14" width="170" height="81" border="0">
</a>
离开链接后,图片是images/1_a.gif;
当鼠标悬停的时候,图片要变换成:images/1_b.gif
光这2个功能,我能通过css实现。
我现在要不仅仅实现以上2个功能,同时我还要点击过这个链接后,图片就是images/1_b.gif。
这个该如何实现呢?
麻烦给出整体代码来。谢谢啊。 展开
<a href="1.ASP" style="cursor:pointer">
<img src="images/1_a.gif" name="Image14" width="170" height="81" border="0">
</a>
离开链接后,图片是images/1_a.gif;
当鼠标悬停的时候,图片要变换成:images/1_b.gif
光这2个功能,我能通过css实现。
我现在要不仅仅实现以上2个功能,同时我还要点击过这个链接后,图片就是images/1_b.gif。
这个该如何实现呢?
麻烦给出整体代码来。谢谢啊。 展开
3个回答
展开全部
1、新建html文档。
2、准备好需要用到的图标。
3、书写hmtl代码。<div id="aaaa"><ul>,<li><img src="lanren01.jpg" width="218" height="155" /><h2>成都康定理塘稻城亚丁然后说再见</h2></li>。
4、书写css代码。<style>*{ margin:0; padding:0; list-style:none;}img{ border:0;}body{ background:#000;};#aaaa{ width:460px; height:auto; margin:150px auto; overflow:hidden;}。
5、书写并添加js代码。<script src="jquery.min.js"></script><script>$(function(){var imgs = $('#aaaa li');
6、代码整体结构。
展开全部
a:actived{
background:url(images/1_b.gif) no-repeat;
}
background:url(images/1_b.gif) no-repeat;
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<html>
<script language="javascript">
function jiaohuan(){
document.getElementById('im').src="2.jpg";
}
function huanyuan(){
document.getElementById('im').src="1.gif";
}
</script>
<body>
<a href="2.jpg"><img id="im" src="1.gif" onmouseout="huanyuan();" onmouseover="jiaohuan();"/></a>
</body>
</html>
<script language="javascript">
function jiaohuan(){
document.getElementById('im').src="2.jpg";
}
function huanyuan(){
document.getElementById('im').src="1.gif";
}
</script>
<body>
<a href="2.jpg"><img id="im" src="1.gif" onmouseout="huanyuan();" onmouseover="jiaohuan();"/></a>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询