Handy jQuery Zoom

Sometimes you just need to take a closer look at an image; the standard web 2.0 (horrible term) way is to use a ‘lightbox’ type effect; this can get a little boring after a while. Why not try something different? This is where a plugin called loupe comes in.

It’s built on the excellent jQuery JavaScript library so is dead simple to impliment:

[cc lang="javascript"]
//Initialise
$(‘#mygreatpictureID’).loupe({
width: 200,
height: 150,
loupe: ‘magClass’
});
[/cc]

A few lines of JavaScript and you get a great looking zoom feature for your users. Move your mouse over the image to view the effect.

loupe mouse hover zoom plugin

Leave a Reply