[javascript] Hammer.js를 사용하여 터치 이벤트를 특정 요소에 제한하는 방법은?
  1. 먼저, Hammer.js를 프로젝트에 추가합니다. 다음의 스크립트 태그를 HTML 파일의 head 태그 안에 추가합니다.
<script src="https://hammerjs.github.io/dist/hammer.min.js"></script>
  1. 특정 요소에 Hammer.js를 적용하기 위해 JavaScript 코드를 작성합니다. 제한하고 싶은 요소의 선택자를 사용하여 해당 요소를 찾습니다.
// 요소 선택
var element = document.getElementById('myElement');

// Hammer.js 인스턴스 생성
var hammer = new Hammer(element);

// 이벤트 제한 설정
hammer.get('pan').set({ enable: false }); // 팬 이벤트 비활성화
hammer.get('pinch').set({ enable: false }); // 핀치 이벤트 비활성화
hammer.get('rotate').set({ enable: false }); // 회전 이벤트 비활성화

위의 예시에서는 myElement라는 ID를 가진 요소를 제한하고 있습니다. 필요에 따라 다른 요소 선택자를 사용하여 해당 요소를 찾을 수 있습니다.

  1. 위의 코드에서는 팬, 핀치, 회전 이벤트를 비활성화하도록 설정하였습니다. 필요한 이벤트만 제한하고 싶다면 위의 코드를 수정하여 설정할 수 있습니다. 예를 들어, 팬 이벤트만 비활성화하고 싶다면 다음과 같이 코드를 작성합니다.
hammer.get('pan').set({ enable: false }); // 팬 이벤트 비활성화

이제 해당 요소의 터치 이벤트가 제한되었을 것입니다.

참고 자료: