欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

鼠标移动,修改背景图片

程序员文章站 2022-07-03 23:30:35
...

第一种方法:使用hover实现
html:

<div id="Library"></div>

css:

#Library {
       background-image: url('./hoverBefore.png');
       height: 22px;
       width: 120px;
    }
#Library:hover {
   background-image: url('./hoverAfter.png');
}

第二种方法:使用onmousemove和onmouseout实现

<img src="./hoverBefore.png" 
     onmousemove="this.src='./hoverAfter.png'" 
     onmouseout="this.src='./hoverBefore.png'" 
alt="实况数据">