CODEWITHSUNDEEP
google-chromeiframevimeoautoplay
Andrew Dean
Andrew Dean

Reputation: 325

Muted Iframe video with googles new Autoplay Policy Changes

googles just updated there "Autoplay Policy Changes" but I want to implement a muted auto-playing Vimeo background video and after reading the article I believed adding the following to the iframe would work.

chrome version: 68

allow="autoplay; fullscreen"

but no luck and I'm not sure what else to try other then the JS API which i don't even know if it will make a difference. 

<iframe src="https://player.vimeo.com/video/265188275?autoplay=1&loop=1&autopause=false&byline=false&title=false&byline=false&frameborder=0" allow="autoplay; fullscreen">

thanks in advance for any helpful advice.

Upvotes: 3

Views: 3323

Answers (1)

Tommy Penner
Tommy Penner

Reputation: 3018

If you're using the Vimeo embedded iframe player as a background video, you should use the embed code with the background parameter instead of the autoplay and loop parameters:

<iframe src="https://player.vimeo.com/video/76979871?background=1" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

The background parameter will hide all player buttons and elements (play/pause, playbar, title, byline, etc.), loop the video, autoplay the video, and mute the video. That last part is important - by default, Chrome will always allow muted videos to autoplay. For videos to autoplay with audio turned on, Chrome uses a "Media Engagement Index" to determine if the viewer actually wants or expects video with audio to autoplay when navigating to your page. That whole process is documented by Google here: https://developers.google.com/web/updates/2017/09/autoplay-policy-changes

The background parameter of the Vimeo Player is documented here: https://help.vimeo.com/hc/en-us/articles/115011183028-Embedding-background-videos

Upvotes: 1

Related Questions