모바일 웹 랜딩페이지 제작 중 video를 삽입하면서 알게된 사실을 공유!
IOS는 나를 너무 힘들게 한다.
아이폰 충성 이지만 ,, 정털릴뻔,,
IOS에서 video를 재생하려면 'muted autoplay playsinline'이 세가지 속성을 필수로 써야한다!
swiper 기능, scroll event로 video play를 제어 하는것에 몇날 몇일을 개고생해서 다 완성 했더니
갑자기 하루 아침에 IOS에서 video 자체가 보이지 않았다.
정말 너무 놀래버렸따..PC도 안드로이드도 다 잘나오는데 왜..!! 왜..!!!! 왜 너만..!!
그래서 내가 전날 수정한 코드들을 하나 지우고 확인, 하나 지우고 확인..
하다가 포기할 뻔 했지만 포기할 수 없지!!!!!!!!!!
구글링으로 답을 찾았다.. 아이폰이 저전력 모드 일때는 video 태그의 autoplay를 지원하지 않는다는데..
심지어 나는 autoplaya도 사용하지 않으려고 빼놓은 상태라.. 아예 video 자체가 보이지 않았다.
그래서 html video태그에 autoplay를 추가하고 확인해본 결과
..autoplay는 되지 않지만 video가 나오긴 나온다!!!! 재생버튼이 있는채로
그래도 이게 어디냐..
앞으로 video 태그를 쓸때에는 세가지 속성을 잊지않고 작성하자!
저전력 모드일때 video 태그의 callback 이벤트가 있는데, 나는 사용하지 않기로 했다!
https://logfetch.com/html-autoplay/
