Jquery Photo Zooming Plugin With Tutorial

Introducing a new jquery PhotoZooming Plugin, view bigger images on mouse over component, this is very useful for media related web applications. you can customize the photo zooming container based on your web page design. very easy to implement just include the plugin using script tag and required selector.

Following this steps for Basic Setup
first include your favorite image inside the body tag ok, i give a simple example below

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

and second steps setup a plugins, plugin name is elevetzoom ok, now link a cdn directory inside a head tags now just a copy and past below this this link.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/elevatezoom/3.0.8/jquery.elevatezoom.min.js"></script>

Now this is a last setup for this plugin. Body bottom Write a script tag inside the code below just copy and past this code. and change this id name. and after open this browser and show this result.
$("#zoom_01").elevateZoom(
{ 
zoomType : "lens", 
lensShape : "round", 
lensSize : 200 
});