반응형
비디오 영역에 재생버튼이 한가운데에 뙇! 보이는 이슈가 제보되었으나 재현이 되지 않아서 궁금해하고 있었다. 디자인 팀장님께서 아이폰 저전력 모드에서 그런 현상이 발생한다고 알려주셔서 처음으로 원인을 알게 되었다. 우측상단 배터리가 노란색으로 표시되고 있다면 저전력 모드였던 것이다!
제보 스크린샷을 다시 확인해보니 저전력 모드인 것이 맞았고, 나도 설정 > 배터리 > 저전력 모드를 활성화 시키고 다시 확인해 보니 재현이 되었다.
유사 증상에 대해 가장 많이 추천되고 있는 방법은 아래와 같다. (2014년 글!! https://stackoverflow.com/questions/8911247/hide-iphone-html5-video-play-button) 하지만 ios10 까지는 먹혔던 것 같은 트릭이 이제는 먹히지 않는 것 같다. 진짜 비디오 태그는 늘 말썽이다.
video::-webkit-media-controls {
display:none !important;
}
위 방법이 적용이 되지 않길래 혹시 shadow dom 이름이 변경되었나 싶어서 확인봤으나 -webkit-media-controls-container 로 변경해서 테스트 해봐도 적용되지 않았다. 동일 증상에 대해 이야기 하고 있는 글 : https://stackoverflow.com/questions/53071085/how-to-hide-html5-video-controls-on-ios-12
참고
반응형
'개발일지 > Web' 카테고리의 다른 글
[ie11] 스크롤 이벤트가 안 먹혀요 scrollY (X) → pageYOffset (O) (0) | 2020.07.09 |
---|---|
[HTML] iframe은 가고 portals이 온다 (0) | 2020.06.16 |
[HTML] rel="noopener noreferrer"로 새 창으로 열기 보안 취약점 보완하기 (0) | 2019.04.17 |
[HTML] OS/브라우저마다 다르게 보이는 select (0) | 2019.02.18 |
[웹폰트] 눈누, 이렇게 예쁜 무료 한글 폰트가 한곳에..! (0) | 2018.12.21 |