프로그래밍/자바스크립트

이미지, 레이어 등을 드래그 해볼까?

알 수 없는 사용자 2007. 1. 16. 11:24

<STYLE>
.drag
{
CURSOR: hand; POSITION: relative
}
</STYLE>

<script type="text/javascript">
 var dragapproved=false
  var z,x,y

  function move(){
    if (event.button==1&&dragapproved){
      z.style.pixelLeft=temp1+event.clientX-x
      z.style.pixelTop=temp2+event.clientY-y

      return false;

    }
  }

  function drags(){
    if (!document.all)
     return

    if (event.srcElement.className=="drag"){
      dragapproved=true
      z=event.srcElement
      temp1=z.offsetLeft; //z.style.pixelLeft;
      temp2=z.offsetTop; //z.style.pixelTop;
      x=event.clientX
      y=event.clientY
      document.onmousemove=move
    }
  }

  document.onmousedown=drags
  document.onmouseup=new Function("dragapproved=false")

</script>

해준뒤.. <img> 태그나 <div> 등등.. 에서 class="drag" 로 설정 하면 끝~