jQuery Image Zoom Plugin with Custom Magnifying Lens Effects - Tikslus Lens

Yet another jQuery image zoom plugin that applies a magnifying lens effect on a given image to provide an image inner zoom functionality. You can custom the lens' width, height, background, and ratio via plugin's options to fit your needs.

How to use it:

1. Include jQuery javascript library together with tiksluslens.js and tiksluslens.css in the document.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="js/tiksluslens.js"></script>
<link rel="stylesheet" href="css/tiksluslens.css" />

2. Insert an image in the document and use data-big-image attribute to specify the large version of the image.

<div id="demo">
<img src="images/small.jpg" data-big-image="images/big.jpg" class="tiksluslens" />
</div>

3. Call the plugin on the image with default parameters.

$(document).ready(function(){
$("#demo").tiksluslens();
});

4. All the default parameters.

$(document).ready(function(){
$("#demo").tiksluslens({
lensWidth:120, // the width of lens
lensHeight:120, // the height of lens
lensBackgroundColor:'#fff', // the background color of lens
lensBorderColor:'#000', // the border color of lens
showLens:false,
loaderImage:'loader.gif', // image preloader

autoZoomRatio:false // If true it will ignore lensWidth and lensHeight Parameter and sets lens width and height according to high resolution image
});
});

---

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