JS实例-自定义光标

<svg xmlns="http://www.w3.org/2000/svg" id="cursor" viewBox="0 0 1024 1024" width="200" height="200" t="1564321121167" p-id="2713" version="1.1"><path fill="#666666" d="M 539.264 631.68 L 352.576 818.368 L 163.2 131.2 l 687.168 189.44 L 663.68 507.264 l 195.328 195.264 L 796.8 764.8 l -97.664 -97.664 L 796.8 764.8 l -62.272 62.208 L 539.264 631.68 Z" p-id="2714" /></svg>

var body=document.body;    //隐藏光标
body.style="cursor:none";
var cursor=document.getElementById("cursor");    //初始化光标元件
var cursorScale=0.2;
var cursorXpy=-7;
var cursorYpy=-6;
cursor.setAttribute("width",cursor.getAttribute("width")*cursorScale);
cursor.setAttribute("height",cursor.getAttribute("height")*cursorScale);
cursor.style="position:fixed;left:0;top:0";
window.addEventListener("mousemove",function(){
	cursor.style.left=event.clientX+cursorXpy+"px";
	cursor.style.top=event.clientY+cursorYpy+"px";
});

转载于:https://www.cnblogs.com/yangjiale/p/11261243.html