웹 프론트엔드/잡다한 이슈

Safari autoplay시 영상 종료 후 볼륨 버튼을 눌렀을 때 재생되는 이슈

아로리(arori) 2019. 5. 11. 16:22
반응형

이슈 발생

  • Safari에서 <video>autoplay 속성을 사용하여 무음으로 자동 재생시에, 영상 종료 후 볼륨 버튼을 누르면 영상이 재생이 되는 이슈가 있었다.

테스트

  • 재생 완료후에 video.muted값이 변경되면 재생 된다.
  • 볼륨 버튼을 눌러 변경하는 경우와 video.muted 값을 변경하는 경우 둘 다 동일했다.

해결

  • autoplay 속성을 제거하고 JS로 강제 재생하는 것으로 해결하였다.

아래에 테스트한 코드와 재현 영상을 첨부한다.

See the Pen Safari autoplay issue by arori (@arori) on CodePen.

 

 

반응형