Autoplay HTML5 Videos in Fancybox
<p>I'm working on a project that uses Fancybox to display single HTML5 Videos, as well as HTML5 video galleries.</p>

<p>For the single videos, I'm looking to autoplay the video as soon as it's opened in Fancybox, and then close Fancybox when the video has finished playing.</p>

<p>For the videos in a gallery, I'd like to autoplay the video when it's opened in Fancybox, advance to the next gallery item when the video finishes playing, and pause the current video / autoplay the next/previous video if the user navigates through the gallery.</p>

<p>I've included a codepen here: <a href="http://codepen.io/ericjacksonwood/pen/kXKkaq/" rel="nofollow">http://codepen.io/ericjacksonwood/pen/kXKkaq/</a> that includes a couple of my attempts working with Fancybox's "afterLoad" function:</p>

<pre><code>// Attempt 01      
$(".fancybox-video").find('video').play();

// Attempt 02
$(".fancybox-video").find('video').attr('autoplay','autoplay');

// Attempt 03
var vid = document.getElementsByClassName("fancybox-video"); 
function playVid() { 
    vid.play(); 
}
</code></pre>

<p>Any help would be appreciated! Thanks.</p>

<p>-------- Edit --------</p>

<p>The codepen has been updated and is working correctly.</p>