전역 위치 설정하기 offset

offset()

$대상.offset({left:좌표값, top:좌표값})

jQuery의 offset()메서드를 사용하면 전역 위치를 읽는것 뿐만 아니라 설정할 수도 있다.

 

 

다음은 offset() 메서드를 활용한 예제이다.

마우스 클릭한 지점으로 캐릭터 이동 시키기

<script>
    $(document).ready(function(){
        var $char = $("#char");
        $("#wrap").click(function(e){
            var left = e.pageX;
            var top = e.pageY;

            $char.offset({
                left:left,
                top:top
            })
        });
    })
</script>

<div id="wrap">
    <img src="char.png" id="char">
</div>

마우스를 클릭하면 pageX, pageY이벤트 객체를 이용해서 left와 top 위치 값을 가져온 뒤에 offset을 이용해서 설정한다.