모바일에서 touch-punch 사용시 클릭 이벤트 안되는 오류 개선

모바일에서 드래그 기능 (draggable)을 사용하려고

touch-punch.js를 사용했는데,

 

⭐ 드래그 기능과 클릭 이벤트(onclick)를 동시에 사용할때는

드래그만 되고 클릭 이벤트는 잘 되지 않는 문제가 생겼다.

 

 

검색해보다가 개선된 touch-punch.js를 발견했다!

이 touch-punch.js를 사용하면 움직임 수치를 통해 클릭이벤트로 감지하도록 처리할 수 있다.

 

드래그/터치 충돌을 개선한 touch-punch👇

https://github.com/RWAP/jquery-ui-touch-punch

GitHub - RWAP/jquery-ui-touch-punch: A duck punch for adding touch events to jQuery UI

 

 

그럼에도 터치 이벤트 감도가 떨어진다면

밑에 하이라이트한 이 수치를 늘리면 된다!

기존에는 500 / 10이었는데 나는 1500 / 200으로 늘려주었더니

클릭이벤트가 잘 처리되었다.

---

 

 

 

👇 요답변을 참고했다.

it assumes that you mean a click if you hold your finger down for less than 500ms, or if you move your finger less than 10px in any direction

이 수치로 클릭이벤트로 구별함