티스토리 뷰

HTML 에서 박스를 하나 만들어준다.

<div id="result" style="position: absolute; background: #000; 
width: 30px; height: 30px; opacity: 0.4; border-radius: 100%;">
</div>

JS에서 아래와같이 적어준다.

            function resultFun(x) {
                var positionLeft = x.clientX;
                var positionTop = x.clientY;

                document.getElementById('result').style.left = positionLeft - 10 + "px";
                document.getElementById('result').style.top = positionTop - 10 +"px";
            }
            if (document.addEventListener) {
                document.addEventListener("mousemove", resultFun);
            } else if (document.attachEvent) {
                document.attachEvent("onmousemove", resultFun);
                //attachEvent는 IE8이하와 오페라에서 사용하는 명령어이다
            };

 

동그란놈이 마우스를 따라다니는것을 볼 수 있다.

댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
«   2024/03   »
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31
글 보관함