Skip to content
Extensible and responsive jQuery plugin to zoom and pan images based on the Leaflet mapping library
Branch: master
Clone or download
waynegm Prepare for Release 1.2.0
- update dependencies to address security vulnerabilities
- insert widget as child of the target image container (previously just appended to page) fixes issue with images in bootstrap modals
- use $img.position() instead of $img.offset() to determine location of image
Latest commit 8a53d45 Jun 23, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist Prepare for Release 1.2.0 Jun 23, 2018
docs Prepare for Release 1.2.0 Jun 23, 2018
plugindocs Prepare for Release 1.2.0 Jun 23, 2018
src
.gitignore Minor edits Mar 12, 2018
LICENSE
README.md Add multiple image example Nov 7, 2017
package.json Prepare for Release 1.2.0 Jun 23, 2018

README.md

imgViewer2

Extensible and responsive jQuery plugin to zoom and pan images. Zooming and panning works on desktop browsers using:

  • the mousewheel to zoom in and out
  • left mouse button double click to zoom in
  • shift and left mouse button drag to define a area to zoom
  • left mouse button click and drag to pan around.

On touch enabled devices pinch gestures can be used to zoom in and out and tap and drag to pan around.

It is an easily extended, responsive UI component based on the jQuery widget factory that uses the Leaflet mapping library for the underlying image display. It should work on all browsers and platforms supported by Leaflet.

This plugin is the successor to the original imgViewer plugin.

Examples

  1. Fixed size image
  2. Dynamic image size
  3. Decorated, dynamic image size
  4. Custom onClick callback
  5. Control options
  6. Simple extension to display markers and notes
  7. Simple extension using Leaflet plugins to display markers and notes
  8. Simple extension to compare multiple versions of an image

Documentation

  1. Using the plugin
  2. Options
  3. Methods
  4. Extending
  5. Release History
You can’t perform that action at this time.