// Address : JavaScript The Definitive Guide 5/E page 561 ex.17-4
// Date : 2009-11-02
// Cross Briwsing : IE5.5,6,7,8 / FireFox / Opera / Crom / Safari
// Comment : 드래그할 바로 하위 엘레멘트에 drag함수 실행

function drag(elementToDrag,event){
	var startX=event.clientX,startY=event.clientY;//시작위치
	var origX=elementToDrag.offsetLeft, origY=elementToDrag.offsetTop;//이동거리
	var deltaX=startX-origX, deltaY=startY-origY;//최종위치를 시작위치로 재설정
	if(document.addEventListener){
		document.addEventListener("mousemove",moveHandler,true);
		document.addEventListener("mouseup",upHandler,true);
	}else if(document.attachEvent){
		elementToDrag.setCapture();
		elementToDrag.attachEvent("onmousemove",moveHandler);
		elementToDrag.attachEvent("onmouseup",upHandler);
		elementToDrag.attachEvent("onlosecapture",upHandler);
	}else{
		var oldmovehandler=document.onmousemove;
		var olduphandler=document.onmouseup;
		document.onmousemove=moveHandler;
		document.onmouseup=upHandler;
	}
	if(event.stopPropagation) event.stopPropagation();
	else event.cancelBubble=true;
	if(event.preventDefault) event.preventDefault();
	else event.returnValue=false;

	function moveHandler(e){
		if(!e) e=window.event;
		elementToDrag.style.left=(e.clientX-deltaX)+"px";
		elementToDrag.style.top=(e.clientY-deltaY)+"px";
		if(e.stopPropagation) e.stopPropagation();
		else e.cancelBubble=true;
	}

	function upHandler(e){
		if(!e) e=window.event;
		if(document.removeEventListener){
			document.removeEventListener("mouseup",upHandler,true);
			document.removeEventListener("mousemove",moveHandler,true);
		}else if(document.detachEvent){
			elementToDrag.detachEvent("onlosecapture",upHandler);
			elementToDrag.detachEvent("onmouseup",upHandler);
			elementToDrag.detachEvent("onmousemove",moveHandler);
			elementToDrag.releaseCapture();
		}else{
			document.onmouseup=olduphandler;
			document.onmousemove=oldmovehandler;
		}
		if(e.stopPropagation) e.stopPropagation();
		else e.cancelBubble=true;
	}
}