Autoplay YouTube video (privacy-enhanced mode) in fancybox 3

5
votes

It is possible to autoplay a regular YouTube video in fancybox by appending ?autoplay=1 to the video URL:

<a class="lightbox" href="https://www.youtube.com/embed/zRwBVYjUBOc?autoplay=1">video</a>

… and …

$(document).ready(function(){
    $("a.lightbox").fancybox();
});

Unfortunately in some browsers (Chrome, Safari) this doesn't work if the "privacy-enhanced mode" is enabled (youtube-nocookie.com):

<a class="lightbox" href="https://www.youtube-nocookie.com/embed/zRwBVYjUBOc?autoplay=1">privacy-enhanced mode video</a>

The option autoplay=1 is not fully supported on youtube-nocookie.com.

How can I still have the video automatically played in the lightbox with privacy-enhanced mode?

Edit (Mar 23): Firefox, Chrome and Safari start playing the video immediately on https://www.youtube.com/embed/zRwBVYjUBOc?autoplay=1 (also without fancybox – just open the url). I found out that Firefox still starts to play the video on https://www.youtube-nocookie.com/embed/zRwBVYjUBOc?autoplay=1 , only Safari and Chrome don't.

1
jqueryyoutubefancyboxfancybox-3
Could this be cause of the issue? - developers.google.com/web/updates/2017/09/… – Janis
@Janis I don't know if Google's decision has something to do with this. I guess it may be related to the european General Data Protection Regulation. A solution to my issue might be something via afterLoad : function() {} of fancybox. The user has already clicked on a link to open the video in fancybox, so this is no autoplay on load, but on click. – Ben
@Ben maybe I misunderstood your issue but this is a working example with the two modes: codesandbox.io/s/y0kmrk51lj – Fraction
@Fraction Thanks! I first tried it with Safari: my first click on "privacy-enhanced mode video" opened fancybox, but the video did not start playing. After closing fancybox and clicking on the same link again, it worked: Fancybox opened and the video started to play. In Firefox it worked immediately on first click. Thanks to your example I found out that the ?autoplay=1 parameter works in Firefox, when I open the URL youtube-nocookie.com/embed/zRwBVYjUBOc?autoplay=1 , but not in Chrome or Safari. – Ben
If you open the link in a new tab (middle click the link with your mouse) it works. If you open it in the same tab, it doesn't work... I'm in Chrome – Rojo

1 Answers

0
votes

Not entirely sure how this youtube-nocookie is supposed to work but you can surely trigger a click with javascript...

$('video').click();

If the video is in an iframe, you should still be able to do this;

$('iframe').contents().find('video').click();