Goodkit

BigPicture.js

Vanilla JavaScript image / video viewer. Doesn't sit on the DOM when inactive.

Plugin Documentation

...
...
<!-- Image -->
<a data-bigpicture='{"imgSrc": "../assets/img/authentication/cover-1.png"}' href="#" class="d-block mb-3 mb-md-0">
  <img src="../assets/img/authentication/cover-1.png" class="img-fluid" alt="...">
</a>

<!-- Youtube video -->
<a data-bigpicture='{"ytSrc": "9I-Y6VQ6tyI"}' href="#">
  <img src="https://img.youtube.com/vi/9I-Y6VQ6tyI/maxresdefault.jpg" class="img-fluid" alt="...">
</a>