Minimal Image Lightbox Library – Views.js

Views.js is a lightweight vanilla JavaScript plugin which enables you open and display your images in a responsive, configurable lightbox popup.

How to use it:

Place the main JavaScript file right before the closing body tag.

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

Initialize the Views.js with default options.

var viewer = new Views(Element);

Customize the image lightbox with the following options.

var viewer = new Views(Element,{
    defaultTheme: true,
    prefix: '',
    loader: '',
    closeButton: '<svg version="1.1" id="close-svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px" height="24px" viewBox="0 0 32 32" enable-background="new 0 0 32 32" xml:space="preserve"><line fill="none" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" x1="6.808" y1="6.808" x2="25.192" y2="25.192"/><line fill="none" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" x1="6.808" y1="25.192" x2="25.192" y2="6.808"/></svg>',
    anywhereToClose: true,
    openAnimationDuration: 0,
    closeAnimationDuration: 0
});

Changelog:

09/17/2018

• add z-index