Simple Touch-enabled Image Viewer Plugin with jQuery

File Size: 6.57 KB
Views Total: 1695
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Simple Touch-enabled Image Viewer Plugin with jQuery

A simplest jQuery image viewer plugin which allows you to display images in a responsive lightbox, with support for custom trigger/close events, retina images, and custom viewer open animations.

How to use it:

1. Load the jQuery library and the jQuery image viewer plugin in the document.

<script src="//"></script>
<script src="image-viewer.js"></script>

2. Call the plugin on the images and you're done.


3. Customize the image viewer.


/* Prepend this to CSS class names */
classPrefix: 'image-viewer',

/* Class to add to images when they're bound to the viewer */
boundClass: 'image-viewer-bound',

/* Events (on the source images) which trigger the viewer */
triggerEvents: 'click',

/* Non-exhaustive list of events which close the view */
closeEvents: 'click keydown keypress blur',

/* High-quality image URL generator (default: same as source image) */
hiResImageGenerator: identity,

/* Buttons are in container or dialog? */
buttonParent: 'container',

/* Called when an image is viewed */
onView: scrollImageIntoView


Change logs:


  • CSS bugfix


  • bugfix


  • Fixed background, no CSS left in the script

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