jQuery Image Zoom Plugin

This is a nifty jQuery plugin that handles image zoom on hover, as you know from eBay.

• Fully customizable
• Colored tints
• Fancybox gallery support
• Variable zoom on mouse scroll
• External controls
• Window zoom, lens zoom and inner zoom
• Free to use under MIT and GPL licenses

Installation and usage

Download the source files and include the jquery and elevatezoom plugin files into your project

<script  type="text/javascript" src="jquery.js"></script>
<script src="jquery.elevatezoom.js" type="text/javascript"></script>

Include your Image

Elevate Zoom works best using two images, one low resolution for the visible image, and one high resolution for the zoomed image. If you only have one image available, Elevate Zoom will still work if you scale down the image, although this is not recommended as your page load time will increase if you are loading larger images

Please ensure your small image is proportionally scaled down from the large image.

<img id="zoom_01" src="small/image1.png" data-zoom-image="large/image1.jpg"/>

Activate the zoom - Basic Example

$("#img_01").elevateZoom();

More Examples

See more examples of the image zoom.

Help & Support

Post to forum if you need any help.

Image Zoom Home

http://www.elevateweb.co.uk/image-zoom

-- Contributors: Peter Thoeny - 2014-01-22

Discussion

I discovered this jQuery plugin. Posting it here, it might come in handy for a custom TWiki application.

-- Peter Thoeny - 2014-01-22