Youtube embedded overlay image
$(document).ready(function() {
$('#play-video').on('click', function(ev) {
this.style.display = 'none';
thevid = document.getElementById('video');
thevid.style.display = 'block';
$("#video")[0].src += "?autoplay=1";
ev.preventDefault();
});
});
<div class="video-container">
<img src="img/yt-video.jpg"/ id="play-video" class="img-responsive">
<iframe style="display:none" id="video" src="https://www.youtube.com/embed/SzmioR4Dj8E" frameborder="0" allowfullscreen></iframe>
</div>