FLEXBOX YOUTUBE THUMBNAIL GRID

Author:

  • Greg Sweet

Made with:

  • HTML / CSS (SCSS) / JavaScript

About the code:

This is an amazing Responsive flexbox unordered list grid of YouTube video thumbnails with Fancybox links. It uses a 9kb image with a 16:9 aspect ratio to be able to use the YouTube thumbnails as a background image, without seeing those black letterbox bars at the top and bottom. This also makes the video thumbnails fluid when resizing the browser.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: jquery.fancybox-three.css, jquery.js, jquery.fancybox-three.js

Download Demo and Code