0

I'm starting to build a very simple html5 video player. I've started with the following markup:

            <video
                autoplay
                loop="loop"
                muted=""
                width="100%"
                height="auto"
controls="true"     src="media/video.mp4"
            >

            </video>

At this point if I run a test the video plays perfectly well in Chrome and Firefox on linux and Mac. (untested in IE).

However, no video will play on Safari on either the desktop or mobile. My Mac desktop version is 11.01. My iphone and ipad are running iOS 11.2.

On Safari, where there should be video playing there is a black placeholder. In the middle of placeholder is an icon that looks like a 'play' icon with a bar running through it crossing it out.

How do I get mp4's to play on Safari using the video tag?

bob
  • 753
  • 4
  • 15
  • 27
  • 1
    [What codecs are you using?](https://developer.mozilla.org/en-US/docs/Web/HTML/Supported_media_formats#Browser_compatibility) – Quentin Dec 05 '17 at 11:42
  • [May be you need to read this](https://stackoverflow.com/questions/20347352/html5-video-tag-not-working-in-safari-iphone-and-ipad) – Ram Chandra Neupane Dec 05 '17 at 15:40

0 Answers0