웹킷 브라우저에서 터치 하이라이트 제거하기

발생일: 2014.08.12

키워드: iOS, webkit, safari, touch highlight, 터치 하이라이트, 웹킷, 아이폰, hover

문제:

전체 화면을 터치했을 때 특정 액션이 일어나도 처리하려고 한다.
헌데, iOS 웹킷에서는 터치할 때마다 hover 효과처럼 터치 하이라이트가 보인다.

그냥 하이라이트 없이 이벤트만 할당하고 싶은데, 어떻게 하면 될까?


해결책:

웹킷에는 탭 하이라이트 컬러를 설정할 수 있는 `-webkit-tap-highlight-color`라는 CSS 속성이 있다.
이 속성의 opacity를 100%로 설정하면, 터치 하이라이트를 제거할 수 있다.

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);


카테고리

분류 전체보기 (710)
About me. (6)
Daylogs (675)
영어공부 (0)
My works - 추억 (29)
비공개 (0)