Lightbox is an application used to display large images inside modal windows. By now, most of us have come across a gallery that makes use of such an application. Clicking on the thumbnail in the gallery, brings up a modal window which displays the larger image.

Over the years, the lightbox has been enhanced to display all sorts of content, not just images. Today, there are numerous lighbox variations available on the web. The Greybox, Lightbox JS, Greased Lightbox, Prototype window class, LITBox, Suckerfish HoverLightbox, Theickerbox, WP Lightbox, and the list goes on.

All of these variations have their particular features. Where some are limited, others excel and vice versa. What is consistent with the different variations is that they all require a Javascript library to perform the desired functionality.

The downside to loading the Javascript library, is that it affects the website load speed which can sometimes be annoying. If you require the same Javascript library to run a number of applications, it makes sense to go this route. But if the sole purpose of the Javascript library, is the lightbox effect, there is a simpler answer, a 100% CSS lighbox effect.