20220906

TIL - 20220906

오늘은 모던 JavaScript 튜토리얼에서 드래그 앤 드롭과 마우스 이벤트에 대해 공부했다. 작성한 질문은 다음과 같다. 드래그 앤 드롭 알고리즘은 다음과 같은 순서로 진행된다. mousedown에는 움직일 요소를 준비한다. 이때, 기존 요소의 복사본을 만들거나 해당 요소의 클래스를 추가하는 등 원하는 형태로 작업할 수 있다. 이후 mousemove에서 position:absolute의 left, top을 변경한다. mouseup에서는 드래그 앤 드롭 완료와 관련된 모든 작업을 수행한다. 이러한 기반을 이용하여 날아가는 요소를 강조하거나 특정 영역이나 방향으로 드래그하는 것을 제한할 수도 있다.