Featherlight is a very lightweight jQuery lightbox.
Featherlight is very, very lightweight. 400 lines of JavaScript, 100 of CSS, less than 6kB combined.
Don't be fooled by Featherlight's small footprint! It's smart, responsive, supports images, ajax and iframes out of the box and you can adapt it to your needs.
To get started, simply add the "data-featherlight" with a selector, an image or an ajax-url. It's that simple.
Many lightbox plugins try to handle everything for you. Even the ones called «simple» or «lightweight». Featherlight is different. It's for the pro who knows what he’s doing and just needs a barebones plugin.
Thanks to very low specific css selectors and little code, it's easy to customize and to understand.
It's meant to be extended, like our gallery extension.
Featherlight works on IE8+, all modern browsers and on mobile platforms.
Featherlight has an extensive test suite.
Featherlight runs on hundreds of thousands of websites. That we know of.
This is a default featherlight lightbox.
It's flexible in height and width.
Everything that is used to display and style the box can be found in the featherlight.css file which is pretty simple.
It's easy to override the styling of Featherlight. All you need to do is specify an additional class in the data-featherlight-variant of the triggering element. This class will be added and you can then override everything. You can also reset all CSS: $('.special').featherlight({ resetCss: true });
With little code, you can build lightboxes that use custom content loaded with ajax...