[javascript] Hammer.js를 사용하여 터치 이벤트를 알림 메시지에 적용하는 방법은?

먼저, Hammer.js를 웹 페이지에 추가해야 합니다. 다음 예제 코드를 사용하여 Hammer.js를 로드합니다.

<script src="https://cdn.jsdelivr.net/npm/hammerjs"></script>

Hammer.js를 적용할 알림 메시지 요소를 선택하고 해당 요소를 Hammer 객체로 초기화합니다. 그리고 터치 이벤트를 등록하여 필요한 작업을 수행합니다. 아래 코드는 알림 메시지에 터치 이벤트를 적용하는 예제입니다.

// 알림 메시지 요소 선택
const notificationMessage = document.querySelector('.notification-message');

// Hammer 객체 초기화
const hammer = new Hammer(notificationMessage);

// 터치 이벤트 등록
hammer.on('tap', function(event) {
  // 터치 이벤트 발생 시 수행할 작업
  // 예: 알림 메시지를 닫기
  notificationMessage.style.display = 'none';
});

위 코드에서는 .notification-message 클래스를 가진 요소를 선택하고, 해당 요소를 Hammer 객체로 초기화합니다. 그리고 tap 이벤트를 등록하여 터치 이벤트가 발생했을 때 알림 메시지를 닫는 작업을 수행합니다.

다른 터치 이벤트 종류인 swipe, pan, press 등을 사용하여 다양한 동작을 구현할 수 있습니다. Hammer.js의 문서를 참조하여 자세한 사용법을 확인하세요.

참고 문서: