Javascript

Library fastclick 모바일웹에서 터치 딜레이를 없애주는 라이브러리

모바일웹에서 링크를 탭하면 300ms속도의 딜레이가 발생하는데 그 이유는 더블탭을 확인하기위하여 약간의 딜레이가 발생한다. 하지만 그 작은 딜레이가 작동이 뭔가 문제가 느껴지거나 체감상 느리게 느껴지게 하는 원인이 된다.
그래서 이 라이브러리는 300ms딜레이를 제거했다.

자세한 내용은 아래에 있는 링크로 들어가서 참고하길 바란다.
출처 및 제작사 GitHub : https://github.com/ftlabs/fastclick

1. <head/> 엘리먼트에 아래와같은 meta엘리먼트를 넣어준다.

<meta name="viewport" content="initial-scale=1.0, user-scalable=no">

ie10일경우 아래와같은 css코드에서 a, button {-ms-touch-action: none;}와같이 버튼 엘리먼트 터치 속성을 변경한다.


2. 자바스크립트를 로드한다.

<script type='application/javascript' src='/path/to/fastclick.js'></script>


3. 자바스크립트를 실행한다.
native

window.addEventListener('load', function() {
FastClick.attach(document.body);
}, false);

jquery

$(function() {
FastClick.attach(document.body);
});



ps. fastclick 을 특정부분에서 무시하려면 아래와같이 특정이름의 클래스를 넣어준다.

<a class="needsclick">Ignored by FastClick</a>

ps. 솔루션 cdn경로 : /img_up/_addon/_plugin/fastclick/1.0.0/fastclick.min.js
게시글 공유 URL복사
댓글[1]

열기 닫기

댓글작성

열기 닫기

댓글작성

top