js实现图片跟随鼠标移动

这次做的是和鼠标移动然后不断获取坐标相关的一个小功能。

这里视频放不了就不放了，大家可以直接复制代码运行就行

这次相对来说轻松一些毕竟总共代码行也就三十几行，掐头去尾也就十几行。

因为只是为了实现这个小功能，所以也就没有考虑美观等方面。图片是张GIF图，网上随便找的。

代码如下：

大致过程无非就是：

先插入一张图片，然后获取这张图片，获取鼠标移动的坐标，然后改变图片的位置，使图片跟着自己的鼠标移动而移动。

这里面eventTarget(目标对象).addEventListener()是一种事件监听的方式。

括号里面的mousemover是指事件为鼠标移动的意思。

后面函数就是为了实现鼠标移动具体要实现的功能

e.pageX/Y是指获取当前的坐标

下面pic.style.left/top意思就是用来鼠标移动时使得图片改变样式，里面减去了30和25目的只是为了图片能在鼠标的中间，不减也行，但是鼠标会在图片的左上角。

这里面需要注意的小细节是px问题。在我们改变图片位置的时候如果只写

pic.style.left = x是没有用的，一定不要忘记在后面加上单位。

这次的源码就不放微云了。