Ios safari video autoplay not working

Goings nuts over here — cannot figure out how to disable video autoplay in Safari.

Never did this on my iOS 14 XR.

Tried Settings > Accessibility > Motion but video autoplay was already disabled there.

Anyone have a solution or am I just missing something obvious?

Got an example link to a page on your site where it's not working in Safari 13?
Some browsers and video content would need user action. If it's without Audio, it should play just fine.

No customer really wants autoplaying video with Audio so don't force that on people unless you're 100% sure it's going to add some value.

★ I jump on these forums in my free time to help and share some insights. Not looking to be hired, and not looking for work. http://freakdesign.com.au ★

Please turn on JavaScript in your browser and refresh the page to view its content.

Here is the little hack to overcome all the struggles you have for video autoplay in a website:

Check video is playing or not.
Trigger video play on event like body click or touch.

Note: Some browsers don't let videos to autoplay unless the user interacts with the device.

So scripts to check whether video is playing is:

Object.defineProperty(HTMLMediaElement.prototype, 'playing', { get: function () { return !!(this.currentTime > 0 && !this.paused && !this.ended && this.readyState > 2); }});

And then you can simply autoplay the video by attaching event listeners to the body:

$('body').on('click touchstart', function () { const videoElement = document.getElementById('home_video'); if (videoElement.playing) { // video is already playing so do nothing } else { // video is not playing // so play video now videoElement.play(); } });

Note: autoplay attribute is very basic which needs to be added to the video tag already other than these scripts.

You can see the working example with code here at this link:

How to autoplay video when the device is in low power mode / data saving mode / safari browser issue

To optimise pages on this blog I recently replaced the animated GIFs with auto-playing videos. It required a couple tries to get it right, so here’s how it works.

The video below won’t autoplay.

To fix this we add the muted attribute, this will disable the audio, making the video less intrusive.

However the video above still won’t autoplay on iOS Safari, Safari requires us to add the playsinline attribute.

We can try to hack around these autoplay limitations with some JavaScript, but that will only work if the JavaScript is run as a result of a user action.

The code below won’t work, it will throw a warning in the developer console.

document.querySelector('video').play();

The play action below will work because the code runs as a result of a user action.

<button>Play</button> <script> document.querySelector('button').addEventListener('click', () => { document.querySelector('video').play(); }); </script>

Press to play the first video on the page.