Translate

[HTML][CSS] 이미지 누를 시 파란 선택화면(탭 하이라이트) 나오지 않는방법

날짜:



Android 4.4 이상의 단말기의 OEM Browser 에서 이미지를 터치 했을 때 잠시 딜레이가 있으면 이미지가 선택이 되었다는 파란색 영역이 보이게 된다.
(iOS 에서는 언제부터 표시가 되는지 모름;;)




약 0.5~1초 정도 누르고 있으면 아래와 같이 선택된 영역이 선택된것 처럼 보이게 된다.




해결 방법은 다음과 같다.
(둘중에 편한 방법을 사용하면 된다.)

<html>
<head>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0">
    <style>
        a { -webkit-tap-highlight-color:transparent; }
    </style>
</head>
<body>
    <a href="#"
       style="-webkit-tap-highlight-color:transparent;">
        <div style="background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSBC9Z4lTyt_U37vGGGM6XTXzknJdP8wCP6z2WPYpBkipl3MUBudvQH7vST57sY6gaWlgrEYBo4BWoGxkcTaXFsGjG1N0YzQEfz7jp08vCYYF8P9fzmdQjuaeXIWSVtEnoVU62ZG698Pw/s1600/2.jpg'); width:150px; height:174px;"></div>
    </a>
</body>
</html>




댓글

댓글 쓰기