Introducing Wadda the Image Zoomer using Canvas�|�INSIC DESIGNS

Wadda is the next generation image zooming technology utilizing Canvas technology to zoom into images. This allows user to have multiple levels of zoom without having multiple high definition images for each level of zoom.

ts “really” easy! use the normal image tag with title=”url_of_hd_image” so for example:

1. 

where foo.jpg is thumbnail image and foo_hd.jpg is the high defination image.

On your required event create the wadda object, like this:

view plaincopy to clipboardprint?

1. var wad = new Wadda(’thumb’, {
2. lensSize: 150,
3. xOff: 0,
4. yOff: 0,
5. fadeLens: true,
6. zoom: 2
7. });

where xOff is x-offset from mouse cursor and yOff is y-offset from mouse cursor, zoomis the initial zoom of image, lensRadius is the radius of lens and fadeLensenables/disables lens fade effect.

View Demo 1

View Demo 2

Want to try it yourself?

Download Files

Introducing Wadda the Image Zoomer using Canvas�|�INSIC DESIGNS