iOS Safari에서 더블 터치로 인한 화면 확대 방지

iOS 10에서부터 뷰포트 메타에 user-scalable=no 가 정상 실행되지 않아 사용자의 임의 확대 축소를 막을 수 없게 됨.

문제

사용자의 확대/축소 의도가 아닌 버튼 연타 등으로 화면이 확대되는 현상으로 CSS에 touch-action: manipulation를 사용하는 것으로 해결이 안되는 상황일 때.

해결 방법

어떡하지 고민하다 그런 문제가 발생하지 않는 기존 작업페이지를 보니 FastClick이 모두 적용되어 있어서 체크해보니 해당 현상을 막을 수 있는게 덤.
FastClick 플러그인 적용 https://github.com/ftlabs/fastclick

주의

이미 작업되어진 페이지에 추가로 FastClick 플러그인을 사용할 경우 페이지내 클릭 테스트가 필요.
특히 iScroll 플러그인을 사용한 영역에서 클릭이 되지 않을 수 있으니 특히 더 주의.
만약 플러그인 적용 후 클릭이 되지 않으면 해당 엘리먼트 클래스에 needsclick 추가.
(참고 : https://github.com/ftlabs/fastclick#ignore-certain-elements-with-needsclick)