Litebox

A modern, lightweight, accessible, responsive, and touch-friendly lightbox to showcase images.

Litebox

Published

2018

Technologies

Vanilla JavaScriptLibraryGitHub Pages

After looking for a simple lightbox solution, I was left surprised that almost all of them use jQuery, which I didn't want to use in my projects anymore (unless necessary).

Thanks to modern JavaScript, it is now easier than ever to build such things without any dependencies, so I decided to give it a go. I started to develop a custom lightbox without any third-party scripts with the same functionality as existing solutions but below the size limit of 15 KB.

Litebox is the result of that work. It's an image-only lightbox with customizaton options (selectors, labels, controls, animations, etc.) and weighs around 12 KB. Currently, version 0.8.3 it's still in beta development but can be used on websites today.

The JavaScript is written in modern EcmaScript 2015 and transpiles into more browser-compatible code thanks to Babel. All major browsers - including Internet Explorer 11 - support this script. The CSS is written in SCSS to give it a modular approach and simplify customization.