美文网首页
光标跟随

光标跟随

作者: 优秀的收藏转载分享 | 来源:发表于2020-09-22 11:18 被阅读0次
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            *{
                margin: 0;
                padding: 0;
            }
            #div1{
                width: 0;
                height: 0;
                border-top: 10px solid blue;
                border-bottom: 10px solid transparent;
                border-left: 10px solid transparent;
                border-right: 10px solid transparent;
                border-radius: 50%;
                position: absolute;
                left: 0;
                top: 0;
            }
        </style>
        <script>
            document.onmousemove=function(e){
                var div=document.getElementById("div1");
                div.style.left=e.clientX+"px";
                div.style.top=e.clientY+"px";
            }
        </script>
    </head>
    <body>
        <div id="div1"></div>
    </body>
    </html>
    

    相关文章

      网友评论

          本文标题:光标跟随

          本文链接:https://www.haomeiwen.com/subject/pkxwyktx.html