모바일환경에서 a,input 등을 클릭하면 계속 활성화 되어있습니다.

말그대로 모바일환경에서 a,input 등을 클릭하면 계속 활성화 되어있습니다.

se-daan.github.io

아이폰X로 테스트시,  링크나 버튼을 탭하면 계속 눌러진 모습으로 나타납니다.

단순한 문제일 것 같은데 검색을 해도 같은 문제를 못찾겠네요(키워드를 못찾나봅니다ㅜㅜ).. 

어떻게 해결해야 할지 도움주시면 감사하겠습니다!

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
  • 안녕하세요~^^

    모바일 기기는 마우스가 아닌 터치로 컨트롤하기 때문에

    PC와는 다르게 한 번 터치 시 마우스 오버 효과가 발생합니다.

    PC 화면에서만 hover 속성을 적용해보시겠어요?

     

    PC 화면일 때만 hover 속성이 적용되는

    간단한 예제 코드를 작성해봤습니다.

    아래 코드를 적절히 활용해보시겠어요?

    <style>
    .test { height: 30px; background: black; }
    @media screen and (min-width: 600px) {
    	.test:hover { background: blue; }
    }
    </style>
    <div class="test">테스트</div>

    고맙습니다.

이미지 사진은 imgur에 업로드한 뒤 링크 걸어주세요.
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기