DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Cover image for Simple Bootstrap Lightbox
Simon KΓΆhler
Simon KΓΆhler

Posted on

Simple Bootstrap Lightbox

Just a simple lightbox with Bootstrap that uses Animate.css for image animations, and imagesLoaded to preload images. No jQuery, lightbox script or additional CSS is needed, just some pure JavaScript. All styles and positioning of elements were implemented using pure Bootstrap classes.

Using the Bootstrap standard classes

The example is to show that you can build a quite functional lightbox without an additional lightbox plugin, using the Bootstrap standard classes and scripts.

Of course, you can still optimize it a lot and create your own CSS animations with a few simple steps, for example, to save the use of Animate.css.

Libraries I have used, with great thanks to the respective developers

Your feedback is appreciated

If you like this Simple Bootstrap Lightbox, feel free to leave your feedback. Also, I'm always very happy when others can use my work as the basis for great projects.

What would you improve, add, or do differently?

More Stuff

My website
https://simon-koehler.com

Let's connect on GitHub
https://github.com/koehlersimon

MASK.CSS
https://koehlersimon.github.io/maskcss/

Top comments (0)

🌚 Life is too short to browse without dark mode