Video not autoplaying anymore

Hey all,

All of a sudden my background video is no longer autoplaying. It works in webflow but not in the live host (godaddy).

Code used:

<video playsinline autoplay width="100%" id="bgvid">
    <source src="http://emilyruhl.com/emrf.webm" type="video/webm">
    <source src="http://emilyruhl.com/emrf.mp4" type="video/mp4">
</video>

I’ve been using that code for years now and it’s never given me issues. Has something changed?


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hey @Hamzster

Have you read this recent thread for answers?

Not sure if this feature updated affected your code.

The mp4 version has an audio track, so it will not autoplay. Try adding muted to the video tag, so <video playsinline autoplay muted

Also, check that the webm version is uploaded.

Hey all the video is autoplaying when the audio is muted. This didn’t happen before - I understand that a new update block videos that autoplay and have sound…

So is there anyway to have an autoplaying video with sound?

Browsers are adding these restrictions for the sanity of site visitors. From that Safari article:

A note about the user gesture requirement: when we say that an action must have happened “as a result of a user gesture”, we mean that the JavaScript which resulted in the call to video.play() , for example, must have directly resulted from a handler for a touchend , click , doubleclick , or keydown event. So, button.addEventListener('click', () => { video.play(); }) would satisfy the user gesture requirement. video.addEventListener('canplaythrough', () => { video.play(); }) would not.

… meaning, your site visitor has to click something to play a video with audio.

My suggestion, if you want autoplaying video in the design, is to set it to muted. Then you can make another button to unmute it or play another version with audio.