Vanilla JavaScript Responsive Image Lightbox Library – Avalonbox

Category: Javascript , Modal & Popup | October 18, 2016
Author: Nafta7
Views Total: 912
Official Page: Go to website
Last Update: October 18, 2016
License: MIT

Preview:

Vanilla JavaScript Responsive Image Lightbox Library – Avalonbox

Description:

Avalonbox is a simple yet robust image lightbox library that supports fullscreen gallery lightbox mode and arbitrary images with different aspect ratios.

Basic usage:

To use this library, first you have to load the following files into your web project.

<link rel="stylesheet" href="avalonbox.css">
<script src="avalonbox.jss"></script>

And then Insert your image(s) into a DIV container as follow:

<div id="image-gallery" class="gallery">

  <a href="1.jpg">
    <img src="thumb_1.jpg" />
  </a>

  <a href="2.jpg">
    <img src="thumb_2.jpg" />
  </a>

  <a href="3.jpg">
    <img src="thumb_3.jpg" />
  </a>

  ...

</div>