Clearing

Clearing makes it easy to create responsive lightboxes with any size image.

Start From a Featured Image

Sometimes you don’t want to show a gallery full of images on your site, but you want to open the gallery from a single image. By including all of your images in the list and using .clearing-feature on the < li> of your choice, you’ll be able to hide the rest of the images in the on-page gallery. If you want to show more than once, try using our .hide class to set the ones you don’t want to display: none;.

Including Captions

Another common use-case for Lightboxes is to include a caption per image. We’ve made this quick and easy by using data-attributes to hold the content. You’ll just attach this attribute to the image it belongs to and voila!