티스토리 뷰
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이하와 오페라에서 사용하는 명령어이다
};
동그란놈이 마우스를 따라다니는것을 볼 수 있다.
'Study > script.js' 카테고리의 다른 글
[자바스크립트 es6]function 화살표? => !!!! (0) | 2019.11.20 |
---|---|
[자바스크립트 es6] for of 문 (0) | 2019.11.19 |
[자바스크립트/제이쿼리/ajax/xml]ajax 이용하여 xml 데이터 가져오기 (0) | 2019.11.18 |
[자바스크립트 객체지향]classes 생성,생성자로써 활용,상속, super (0) | 2019.11.17 |
[자바스크립트 객체지향]prototype 뭘까이게.. (0) | 2019.11.14 |