JavaScript에서 Touch Events를 지원하는 기기 구별해 내는 법

JavaScript, Notes 댓글 달기

아래 snippet은 Touch Events를 지원하는 iPhone/iPad에서 기존 mousedown/mouseup events를 대신하는 touchstart/touchend event 탐지 목적에 쓰일 수 있다.

if ('createTouch' in document) {
  // Touch events are supported. 
  // So we can use touch events like 'touchstart' or 'touchend' instead of mousedown/mouseup. 
}

iPad에서의 click event handling은 약간 지체되는 느낌이 있으므로, 되도록이면 대응하는 touch events를 써주는 것이 좋을 것이다.

그리고 참고로, Android에선 Touch Events를 지원하지만 위의 방법을 사용할 수 없다고 하니, 어쩔 수 없이 navigator.userAgent도 살펴봐야 한다.

function supportsTouch() {
  var android = navigator.userAgent.indexOf('Android') != -1;
  return android || !!('createTouch' in document);
}
꼬리표:

관련된 주제의 글

댓글을 남겨 주세요