모바일 브라우저에서 터치 이벤트 개선하기 트릭 on redgoose note

모바일 브라우저에서 터치 이벤트 개선하기 트릭

Nest: Development Category: html&css 2018-08-20

css로 :active같이 터치를 하고 있을때 모습이 변화되는 것을 집어넣고 모바일 디바이스에서 굼뜨거나 씹히는 현상이 일어나는것을 겪었다.
그래서 좀 트릭같은것을 사용하여 마치 앱같은 사용성을 만들어낼 수 있다는걸 찾았다.

다음과 같이 html에서 ontouchstart에서 빈값을 넣음으로 해서 터치 스타트 이벤트를 미리 막는것으로 반응을 빠르게 할 수 있었다.

<body ontouchstart="">

html 태그에서 넣는것이 용의하지 않는다면 다음과 같이 스크립트를 넣을 수 있는것 같다. (이것은 아직 시도해보진 않았다.)

document.body.addEventListener(‘touchstart’,function(){},false);

위와같은것들을 적용하면 css에서 액티브 이벤트(:active)의 체감속도를 올릴 수 있다.

참고 posts