A lot of our sites require some lightbox functionality. I prefer to use Jan Sorgalla’s Lity. It is fast, responsive, and works right out of the box. You can read up on the specific uses on his site, but the general gist of it is super simple:

Let’s say we want to have a link that opens a lightbox with a YouTube video in it.

  1. Link the Lity CSS and Javascript files ( requires jQuery )
  2. Add a link to a piece of text, button, image, etc with the href of the YouTube URL:
  3. Simply add a “data-lity” parameter to the anchor tag:

That’s it! Clicking on the link should show a size transition leading to a lightbox that plays your video:

You can also link to images, google maps, inline content, and other website urls. Illuminating.