鼠标放在 img上 变成另一张图片，移走鼠标又变回原来的_html/css_WEB-ITnose
- WBOY原创
- 2016-06-24 12:18:262919浏览
鼠标放在 img上 变成另一张图片，移走鼠标又变回原来的，怎么实现不了啊 代码如下：
<html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server"> <title>无标题页</title> <style> .contract { src:url(Image/menuContractUs.jpg) } .contract1 { src:url(Image/menuOnContractUs.jpg) } </style> </head><body> <form id="form1" runat="server"> <div> <ul> <li> <a href="Index.aspx" target="_blank"><img src="Image/menuContractUs.jpg" onmousemove="this.className='contract1'" onmouseout="this.className='contract'"/ alt="鼠标放在 img上 变成另一张图片，移走鼠标又变回原来的_html/css_WEB-ITnose" ></a> </li> </ul> </div> </form></body></html> 上面是代码，各位高手看看哪里错了，谢谢
回复讨论(解决方案)
src:url(Image/menuOnContractUs.jpg)，没有src的样式
写个例子你看下
#a1 div{ width:200px; height:50px; background:url(http://www.baidu.com/img/baidu_jgylogo3.gif) no-repeat ; } #a1:hover div{ background:url(http://www.google.com.hk/images/srpr/logo3w.png) no-repeat ; } </style> <a href="#" id="a1"><div></div></a>
src:url(Image/menuOnContractUs.jpg)，没有src的样式
写个例子你看下
XML/HTML code?12345678910 #a1 div{ width:200px; height:50px; background:url(http://www.baidu.com/img/baidu_jgylogo3.gif) no-r……
使用a:hover功能，这个方便。
或者用css嵌js脚本的办法实现
谢谢楼上的各位，搞定了
<img src="Image/menuContractUs.jpg" onmousemove="this.src='Image/menuOnContractUs.jpg'" onmouseout="this.src='Image/menuContractUs.jpg'" / alt="鼠标放在 img上 变成另一张图片，移走鼠标又变回原来的_html/css_WEB-ITnose" ></a>
这样就行了
声明：
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn