IOS Video tag issue

 

issue 01. 아이폰에서 인라인 재생

​

기존의 아이폰에서는 브라우저를 통해 동영상을 볼 때 항상 전체화면으로 전환된 뒤 재생되었습니다. 하지만 이제 <video> 요소에 playsinline 속성을 추가하면 전체화면 전환 없이 바로 재생이 됩니다. 위에서 언급했듯 아이폰에서 autoplay 속성을 사용하고자 할 경우라면 playsinline 속성을 같이 추가해야 의도대로 화면 안에서 비디오가 바로 재생되는 상황을 만들 수 있는 것이죠.

마지막으로 일반 사용자에게 해당하는 내용입니다. 아이폰으로 웹사이트에서 동영상을 보다가 핀치 동작(두 손가락으로 화면을 터치하여 오므리는 동작)을 하면 전체화면이 해제되면서 안드로이드나 아이패드처럼 페이지 안에서 그대로 재생할 수 있으니 이전보다 편리하게 시청할 수 있습니다.

​

[참조사이트]
https://iropke.com/archive/video-autoplay.html

 

 

issue 02. 안드로이드에서 하위 OS 버전 video tag not showing

​

프로젝트 막바지에 모든 디바이스에서 화면 단위 테스트 진행 중에 안드로이드 하위 OS 버전에서

video 태그가 안먹히는? 현상이 발견됬다, 안드로이드 6버전에서는 자동재생이 안되는 현상 확인하고

안드로이드 하위 버전에서의 문제 해결을 어떻게 할 것인가 고민하다, 클라이언트의 빠른 오픈을 희망하여 일부 기종에서는 video 대신 background img로 대체 하기로 협의했다.

​

방법 : javascript를 이용해 웹사이트를 방문한 안드로이드 버전을 체크하여 이벤트를 적용.

​

[참조사이트]
https://sandro.tistory.com/entry/안드로이드-버전-체크하려고-만들어-본거

 

 

 

Mobile SI Life