I have a simple modal dialog:

• User clicks on button.
• Modal overlay shows.
• YouTube <iframe> element is added.

All is good in most browsers - video starts playing, except Safari 11.1.

Safari has new auto-play policy that requires explicit click and video element to start playing it: /

Is there some way to make it autoplay for dynamically added YouTube (or Vimeo) iframe?

Example YouTube iframe:

<iframe frameborder="0" allowfullscreen="" allow="autoplay; encrypted-media; fullscreen" src=";amp;controls=0&amp;showinfo=0&amp;autoplay=1&amp;enablejsapi=1"></iframe>

I have a simple modal dialog:

• User clicks on button.
• Modal overlay shows.
• YouTube <iframe> element is added.

All is good in most browsers - video starts playing, except Safari 11.1.

Safari has new auto-play policy that requires explicit click and video element to start playing it: https://webkit/blog/7734/auto-play-policy-changes-for-macos/

Is there some way to make it autoplay for dynamically added YouTube (or Vimeo) iframe?

Example YouTube iframe:

<iframe frameborder="0" allowfullscreen="" allow="autoplay; encrypted-media; fullscreen" src="https://www.youtube-nocookie./embed/20iMzRklHNU?rel=0&amp;controls=0&amp;showinfo=0&amp;autoplay=1&amp;enablejsapi=1"></iframe>

• javascript
• youtube
• youtube-api

1 Answer 1

Safari 11 now disables/blocks autoplay features. You have to manually go to the safari settings and Allow All Auto-Play.