eBay Inspired Magnify Image On Hover Plugin - jQuery Magnifier

Magnifier is a lightweight jQuery image zoom plugin inspired by eBay.com that applies a smooth, hover-triggered Magnifying Glass Effect to multiple images.

How to use it:

1. Insert a group of product images into the html document.

<img src="product-1.jpg" class="thumb">
<img src="product-2.jpg" class="thumb">
<img src="product-3.jpg" class="thumb">
<img src="product-4.jpg" class="thumb">
<img src="product-5.jpg" class="thumb">
...

2. Create an empty container to display the enlarged image next to the thumbnails.

<div id="display"></div>

3. Put jQuery JavaScript library and the jQuery Magnifier plugin's script on the webpage.

<script src="https://code.jquery.com/jquery-3.3.1.min.js" 
        integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT" 
        crossorigin="anonymous">
</script>
<script src="jquery.magnifier.min.js"></script>

4. Initialize the Magnifier plugin with the following settings.

• magnify: zoom level
• region: size of zoom region
• display: display area

$('.thumb').magnifier({
  magnify: 10, 
  region: {
    h: 38.7, 
    w: 38.7
  }, 
  display: $('#display')
});

---

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