jquery.snipe

Sniper-lens-style zoom on images


Get started

Check the Demos

View on GitHub RayFranco/jquery.snipe


Examples

More to come

Example 1

No configuration (data-zoom reference)

Insert the image :

<img src="normal.jpg" data-zoom="large.jpg" id="snipe">

Target the image with the plugin by provinding the high definition URL to it :

$('img#snipe').lens();

Result :


Example 2

No configuration (href reference)

Insert the image :

<a href="large.html" id="snipe">
	<img src="normal.jpg">	
</a>

Target the image with the plugin by provinding the high definition URL to it :

$('a#snipe').lens();

Result :


Example 3

Basic jQuery approach

Insert the image :

<img src="normal.jpg" id="snipe">

Target the image with the plugin by provinding the high definition URL to it :

$('img#snipe').lens({
  image: 'large.jpg'
});

Result :