드래그 방향 판단하기

마우스이벤트에 따라서 발생하는 좌표값

screenX : 모니터 기준 좌표

pageX : 페이지(스크롤 포함)

clientX : 브라우저 화면 기준

offsetX : 이벤트 타겟 기준

window.addEventListener(type: 'mouseup', listener:function(e) {
    console.log('mouseup',e);
    드래그시작 = false;
    끝좌표 = [e.clientX,e.clientY];
    var x차이 = 끝좌표[0] - 시작좌표[0];
    var y차이 = 끝좌표[1] - 시작좌표[1];
    if(x차이 < 0 && Math.abs(x차이) / Math.abs(y차이) > 1) {
        방향 = '왼쪽';
    } else if(y차이 > 0 && Math.abs(x차이) / Math.abs(y차이) < 1) {
        방향 = '오른쪽';
    } else if(y차이 > 0 && Math.abs(x차이) / Math.abs(y차이) > 1) {
        방향 = '아래';
    }  else if(y차이 < 0 && Math.abs(x차이) / Math.abs(y차이) > 1) {
        방향 = '위';
    }
});

Last updated