Free Photo Gallery In JavaScript & CSS | zoomwall.js

JavaScript Image Gallery - Zoomwall.js is a content-focused image gallery with a horizontal build layout that expands in Simplified View mode.

This JS library for making a neat, compact thumbnail grid that expands right into a fullscreen gallery lightbox as you click on on a thumbnail picture.

How to make use of it:

Installation:

# NPM
$ npm i zoomwall.js --save

Import the zoomwall.js as an ES module as follows:

import * as zoomwall from "zoomwall.js";

Import the required zoomwall.css stylesheet within the head part.

<link rel="stylesheet" href="zoomwall.css">

Add thumbnails with data-highres attribute pointing to the high-resolution images into your doc.

<div id="gallery" class="zoomwall">
  // Add images Here
  ...
</div>.

It additionally helps responsive picture supply since v1.2

<div id="gallery" class="zoomwall">
  // Add image Here
</div>

Initialize the photograph gallery.

window.onload = function() ;

If you will have a number of galleries on the web page, name the keys() operate after init.

zoomwall.keys();

Pure CSS Lightbox Gallery, ResponsiveForm, CSS Popup Gallery, CSS Grid Image Gallery, zoomwall.js Plugin/Github

Official Website(ericleong): Click Here

This superior jQuery/javascript plugin is developed by ericleong. For extra Advanced Usages, please go to the official website.