Fancybox

JavaScript lightbox library for presenting various types of media. Responsive, touch-enabled, and customizable. Read the plugin documentation

How to use

Just set lightbox using thedata-fancybox attribute and link. Display HTML elements, web pages, video, google maps, and also load content via AJAX with ease. You can mix images, videos, and any HTML content in each gallery.

a.hvr-grow.mr-2(data-fancybox='gallery', href='https://www.youtube.com/watch?v=hkXHsK4AQPs')
	img(alt='Example' src='/images/assets/video-play-2.svg', height='50px')
a.btn.btn-gray(data-fancybox='gallery', href='https://www.youtube.com/watch?v=hkXHsK4AQPs')
	| Launch video

<a class="hvr-grow mr-2" data-fancybox="gallery" href="https://www.youtube.com/watch?v=hkXHsK4AQPs">
	<img alt="Example" src="/images/assets/video-play-2.svg" height="50px">
</a>
<a class="btn btn-gray" data-fancybox="gallery" href="https://www.youtube.com/watch?v=hkXHsK4AQPs">
	Launch video
</a>

Launch video