Responsive Lightbox Plugin for Youtube and Vimeo with Vanilla JS
View demo here
With npm
npm install mediabox --save
You can download the latest version or checkout all the releases here.
Require the package or use the global mediabox
namespace and include style:
var mediabox = require('mediabox');
import mediabox from 'mediabox';
<link rel="stylesheet" type="text/css" href="path/to/mediabox.css">
<script src="path/to/mediabox.js"></script>
<script>
MediaBox('.mediabox');
MediaBox('.mediabox', { rel: '0' }); // Additional options
</script>
Now add class to links, for example:
<a href="https://www.youtube.com/watch?v=3qyhgV0Zew0" class="mediabox">Youtube</a>
<a href="https://vimeo.com/71495477" class="mediabox">Vimeo</a>
![]() |
![]() |
![]() |
![]() |
![]() |
---|---|---|---|---|
IE 10+ ✔ | Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ |
Many thanks to Qassim Alobaidi, who originally created the plugin for jQuery.
Check CONTRIBUTING.md for more information.
Check Releases for detailed changelog.