Zoomy.js

Zoomy.js is a Prototype class that allows you to easily create image gallery: the script make simple magnification of images with customizable options, as popup and overlaying boxes. You can view the source code here. UPDATE (new version is available here)

Features

Zoomy.js display clickable thumbnails and zoomed images when you click: only 1 image required for show thumbs and larger images. Moreover images are preloaded, there is no delay when you zoom.
Display caption and close button (optional) and open new window from a link to the caption; zoomed images may be dragged.
Depend on Prototype Javascript Framework and Scriptaculous (effect.js , dragdrop.js) to work.

Implementations

Add the required HTML markup and customize CSS stylesheet: the miniature is made from the original image used as background. Then initialize Zoomy as below:

    new Zoomy(element,{[options]});

Options

appearDuration: this is the duration of a appear effect of zoomy (default value: 0.5 seconds).
closeButton: when true, show the close button (default value: false).
draggable: makes zoomy draggable and show the close button (default value: false).
hideCaption: (default value: false).

Demo

Simple

Draggable

Download

Get zoomy.js (27/10/2008) - the package contains a patched version of Prototype 1.6 library (to correct bugs on Opera 9.5) + Scriptaculous (effect, dragdrop).

Suggestions

You can post your comments, suggestions or bug reports on my blog: I'm happy to receive aid to improve the script.

License

Zoomy is licensed under the MIT license.