Lightweight Responsive Image Gallery Plugin - Knack

Knack is a simple, lightweight responsive jQuery gallery plugin for showcasing your favorite images in an elegant way.

Features:

• Auto mode: auto rotates through a set of images at a certain speed.
• Manual mode: manually switches between images like a traditional slider.
• Full mode: browses images in a fullscreen view.
• Quick view mode: allows you to browse all thumbnails.

How to use it:

1. Add jQuery library and the jQuery Knack plugin's JS & CSS files into your web project.

<link rel="stylesheet" href="knack.css">
<script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="lib/knack.js"></script>

2. Add the images with descriptions into a JS array as follow:

var images = [
    ["image1.jpg","This is image 1."],
    ["image2.jpg","This is image 2."],
    ["image3.jpg","This is image 3."],
    ...
];

3. Create a DIV container for the image gallery.

<div id="container"></div>

4. Initialize the plugin to generate an image gallery inside the DIV container.

$('#container').knack({data: images});

5. More configuration options.

$('#container').knack({

  // autoplay interval
  'autoPlay': 5000,

  'menuArea': 3000,

  // JS selector
  'id': 'container', 
  
});

Change log:

2016-06-03

• v2

---

This awesome jQuery plugin is developed by evrybiont. For more Advanced Usages, please check the demo page or visit the official website.