怎么用CSS或者JS实现鼠标点击变换背景图片？

JavaScript052

怎么用CSS或者JS实现鼠标点击变换背景图片？,第1张

<img src="1.jpg" width="100" height="100" alt="" onclick="pf(this)"/>

<script type="text/javascript">

var arr = ["1.jpg","2.jpg","3.jpg","4.jpg","5.jpg"]

function pf(t) {

t.src = arr[Math.floor(Math.random()*arr.length)]

}

script>

$("#navi1").hover(function(){

$(this).css("background","url(图片地址1)")

},function(){

$(this).css("background","url(图片地址2)")

})

那5个框 是5个div 捕捉div获得鼠标移动事件

每个div里面有个小的div用来显示图片

当鼠标移动 这里通过算法显示背景图片 背景图片就一张通过

url(https://img.alicdn.com/tfs/TB1PZB0fyqAXuNjy1XdXXaYcVXa-100-1500.png) center 0px / 100% no-repeat 里面的0PX来控制图片显示的东西 0-1400之间图片一直在换高度 就蒙蔽你的眼睛让你看起来像动画

上面的图片就是你看到的背景图在切换

有了思路写起了很简单 就是想不到这个思路