MediaSwipe
Visit http://www.ericw.me/mediaswipe/ for demos & instructions.
Include mediaswipe.js & mediaswipe.css files in your project. Then, give any element in your document a class name js-mediaSwipe (case-sensitive) along with either a 'href' or 'data-image' attribute with the value pointing to the image or video you want to open. For example:
<a href="/images/image-to-open.jpg" class="js-mediaSwipe">Click Me</a>
or
<button data-image="https://www.youtube.com/embed/Scxs7L0vhZ4" class="js-mediaSwipe">Click Me</button>