js、jquery实现图片跟随鼠标 更改鼠标样式功能

html

<div class="mouse_follow">
	<div>
		<img src="/img/cursor.png">
	</div>
</div>

css

这里我直接将透明度改为1了

（要是想在某个元素内显示 就改为0 在js中添加 mousemove 事件将透明度改为1）

/* 鼠标跟随 */
.mouse_follow{
	width: 200px;
	height: 42px;
	position: fixed;
	pointer-events: none;
	opacity: 1;
	z-index: 20000;
	opacity: 1;
	transition: opacity .5s;
}
.mouse_follow img{
	width: 240px;
	height: 50px;
}

js

	class mouseFollow {
		followF(){
			var st = 0
			var mouseTop = 0
			$("body").mousemove(function(event){
                // -25鼠标替换的图片根据css设置大小/2 自己替换数值
				mouseTop = event.pageY-25 - st
				$('.mouse_follow').css({'top':mouseTop,'left':event.pageX-120})
			})
			$(window).scroll(()=>{
				st = document.body.scrollTop || document.documentElement.scrollTop;
			})
		}
	}
	var mouse = new mouseFollow()
	mouse.followF()