鼠标移入单击

鼠标移入单击

开发工具与关键技术：DW / 前端

作者：简志杰

撰写时间：2019年02月07日

鼠标移入单击随之切换，如下图，当鼠标没有移入单击的时候，盒子里是没有图片的，把鼠标移入单击的时候，图片马上出来了，需要看哪张移鼠标去触碰就出来了，触碰到的图都会有一个高亮的效果。

显示效果代码如下，首先在html写代码，是用来引入 js 的

再到css 写下面的代码
list-style: none; 取消无序列表中的默认样式 font-size: 12px; 字体的大小
overflow: hidden; 超出部分隐藏（清除浮动的效果） position:relative; 相对定位
position: absolute; 绝对定位

然后到js写下面的代码

这些代码基本上已经备注的很清楚了，看上去很好理解，都是一些基本的基础，可以照着上面换上你喜欢的图片，任由你操作。