Pure JavaScript Image Lightbox – zbox.js

Category: Javascript , Modal & Popup | July 12, 2018
Views Total:137 views
Official Page:Go to website
Last Update:July 12, 2018


Pure JavaScript Image Lightbox – zbox.js


zbox.js is a simple lightweight JavaScript library used to display images on top of your webpage like the familiar lightbox.

How to use it:

Add the zbox.js into the web page.

<script src="zbox.js"></script>

Add an images on your webpage.

<img src="1.jpg">

Or create a link pointing to your image.

<a href="1.jpg"/>Image Link</a>

Enable the image lightbox.

var a;
document.addEventListener("DOMContentLoaded", function(event) {
  a = new Zbox({
    /* Init zbox when constructor is called. */
    autoInit    : true, 
    /* overlay click close the modal. */
    overlayClick  : true, 
    /* Time in ms for fade effect. */
    fadeTime    : 120, 
    loading     : "Loading image message",
    /* Elements to apply zbox. */
    querySelector   : "img, a", 



  • fade animation now is using requestAnimationFrame

You Might Be Interested In:

Leave a Reply