Easy jQuery Image Inner Zoom Plugin - evenZoom

File Size: 5.63 KB
Views Total: 15967
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Easy jQuery Image Inner Zoom Plugin - evenZoom

evenZoom is a simple-to-use jQuery plugin that creates a magnifying glass effect to provide inner zoom functionality on your image.

How to use it:

1. Load the evenZoom.css to style the lens.

<link href="dist/evenZoom.css" rel="stylesheet">

2. Add original & zoomed images into your webpage as follow.

<div id="demo" data-zoomed="zoomed.jpg">
  <img src="original.jpg" alt="">
</div>

3. Load jQuery library and the evenZoom.js script at the bottom of the webpage.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="dist/evenZoom.js"></script>

4. Initialize the plugin.

$("#demo").evenZoom();

5. Customize the lens pinning distance.

$("#demo").evenZoom({
  
lensPinningDistance: 20
  
});

Change log:

2015-07-21

  • Update evenZoom.js

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