View on GitHub

jQuery.panzoom

A jQuery plugin for panning and zooming elements using CSS3.

Download this project as a .zip file Download this project as a tar.gz file

Drag and zoom any element

View the demo or the tests.

Panzoom is a progressive plugin to create panning and zooming functionality for an element. Panzoom supports the same browsers as jQuery 2.0 and can be used with jQuery 1.9.0+ or jQuery 2.0+. Rather than setting width and height on an image tag, Panzoom uses CSS transforms and matrix functions to take advantage of hardware/GPU acceleration in the browser, which means the element can be anything: an image, a video, an iframe, a canvas, text, WHATEVER.

IE<=8 is not supported, but this plugin is future-proof.

Mobile support

Panzoom includes support for touch gestures on iOS and Android and even supports pinch gestures for zooming. It is perfectly suited for both mobile and desktop browsers. You'll be amazed at how well this performs on your mobile device.

SVG support

Panzoom supports panning and zooming SVG elements directly, in browsers that support SVG.

More info

Panzoom is incredibly customizable. Some options include:

For more information, documentation is available in the README.