html 鼠标跟随

<meta charset="UTF-8">
<title>Title</title>
<style>
    #a{
        width: 400px;
        height: 400px;
        border: 1px solid black;
    }
    #c{
        width: 20px;
        height: 20px;
        background: red;
        float: left;
        position: absolute;
    }

    #b{
        margin-top: 20px;
        width: 400px;
        height: 50px;
        border: 1px solid black;
    }

</style>
<script>
    window.onload=function () {
        var a=document.getElementById("a");
        var b=document.getElementById("b");
        a.onmousemove=function (ev) {
            // ev=event||window.event;
            var y=ev.clientY;
            var x=ev.clientX;
            b.innerHTML="X="+x+",Y="+y;
        };
        var ma=document.body;
        var c=document.getElementById("c");
        var sl=ma.scrollTop||document.documentElement.scrollTop;
        var st=ma.scrollLeft||document.documentElement.scrollLeft;
        ma.onmousemove=function (ev) {
            var x1=ev.clientX;
            var y1=ev.clientY;
            c.style.top=y1+st+"px";
            c.style.left=x1+sl+"px";
        }

    }

</script>