话不多，看效果先：
好久不见~ 平常，我们网页的鼠标光标默认是一个白色的箭头，而我换成了一个卡通小萝莉，这样子让网页有趣了许多~其实实现是非常非常简单的，如下：
二.实现：
1.定义img标签，就以一张图片作为鼠标光标，建议为等宽高的图片：
<img class="mouse" src="img/logo.png" alt="">
2.初始化页面：
*{margin: 0;padding: 0;box-sizing:border-box;cursor: none; }
cursor: none; 清除掉页面默认鼠标样式；
3. 鼠标光标图片的css样式：
.mouse{width: 50px;height: 50px;border-radius: 50%;;position: fixed;left: -200px;z-index: 1000;pointer-events: none;}
z-index: 1000; 显示层级高点；
pointer-events: none; 取消它的鼠标事件，并指向它下面的元素。
position: fixed;
left: -200px; 固定定位，给个值让它在屏幕外；
4.js部分，实现效果：
var mouse = document.querySelector('.mouse');window.addEventListener('mousemove',function(event){mouse.style.left = event.clientX - mouse.offsetWidth/2 + 'px' ;mouse.style.top = event.clientY -mouse.offsetHeight/2 + 'px'; })
核心就是获取鼠标在网页中的位置值，并赋值给鼠标光标，再通过绝对定位设置位置即可。
mouse.offsetWidth/2 别忘了减去自身宽（高）的一半。
四.总结：
是不是很简单~
下次见啦~
其它文章：
~关注我看更多简单创意特效：
文字烟雾效果 html+css+js
环绕倒影加载特效 html+css
气泡浮动背景特效 html+css
简约时钟特效 html+css+js
赛博朋克风格按钮 html+css
仿网易云官网轮播图 html+css+js
水波加载动画 html+css
导航栏滚动渐变效果 html+css+js
书本翻页 html+css
3D立体相册 html+css
霓虹灯绘画板效果 html+css+js
记一些css属性总结（一）
Sass总结笔记
…等等
进我主页看更多~
