<Video> Plays in Other Browsers, But Not Safari

HTML video not playing in Safari browser

Safari has started (in the last year) preventing videos with audio tracks from auto-playing by default. They never specifically publicised this as far as I'm aware, however I believe it was part of the following changes:

Safari 11 also gives users control over which websites are allowed to auto-play video and audio by opening Safari’s new “Websites” preferences pane

(Source)

The only real workarounds for this are to either remove the audio track from the video, or have it muted by default.

<video id="v-control" width="100%" autoplay="autoplay" loop muted>

If your server can detect the requester's browser, you can apply this to just Safari, leaving other browsers as they were before.

Video is playing in chrome,but it is not playing in safari browser

It only works when including playsinline.

<video src="video1.mp4" width="100%" data-id="1" class="video1" type="video/mp4" autoplay="true" loop muted playsinline ></video>
<video src="video2.mp4" data-id="2" width="100%" class="hiddn video2" type="video/mp4" autoplay="true" loop muted playsinline></video>

Second solution :

if the first solution doesn't work, you may need to set the controls="true" flag.

<video loop autoplay controls="true"  src="video1.mp4" width="100%" data-id="1" class="video1" type="video/mp4" ></video>

FYI: if you run it on apple device e.g. Ipad/Iphone and then turn off the low power mode it may works.

Related Topics