<ul> 태그 영역 위로 마우스를 가져 가면 불투명도가 <ul>으로 줄어들고 사용자가 해당되는 전체 불투명도를 <li>으로 설정합니다. 이 샘플 같은터치 장치의 마우스 오버 이벤트
: 터치 장치에서 우리가 가져가 이벤트가없는 사용자가 (터치)을 클릭해야하기 때문에 Image change opacity on hover without jQuery
지금, 문제는, 태블릿 및 휴대폰에 <li>에 이렇게 모든 다른 <li>이 감소 불투명도와 사용자가 <li>의 선택을 취소하면 페이지를 새로 고침 할 수 없습니다.
이 문제를 어떻게 해결할 수 있습니까?
터치 장치의 경우 hover은 지원되지 않습니다. 다음 중 하나를 수행 할 수 있습니다 : 터치 장치 스타일에
• 건너 호버 효과
• 클릭 상호 작용에 가져가 돌려 자바 스크립트를 사용
• 여러 다른 게시물에 있습니다
터치 장치를 가져가 상호 작용을 시뮬레이션하기 위해 자바 스크립트를 사용하여
How do I simulate a hover with a touch in touch enabled browsers?
how to deal with hover effect on touch devices
Hover for Touch Devices
터치 전용 브라우저에서는 :hover이 지원되지 않으므로 touchStart, touchMove 및 touchEnd 이벤트 (자바 스크립트 사용)를 사용할 수 있습니다. 이들은 FastClick 라이브러리에서 잘 사용됩니다.
또한 일부 CSS :hover 이벤트는 화면에 손가락을 대면 터치 전용 브라우저를 통해 활성화 할 수 있습니다.
약간 늦게 ...
하지만 당신은 그것을 다시 숨겨 전에 4-5초의 메뉴를 표시하기 위해 CSS 애니메이션을 사용할 수 있습니다 ...
완벽하지하지만 당신은 JS 제거. . 아니 그 JS는
편집은 .. 내가 AngularJS와를 사용, 잘못된 : - 그녀에게 링크 http://www.greywyvern.com/?post=337
가능하면 OP와 함께 샘플 코드를 공유하십시오. – Panther
여기 봐 찍은 적이을 심판하기 위해했다? 애플은 브라우저가 터치 이벤트에서 할 수 있거나 할 수없는 것을 나열합니다. https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html – ilarsona