Fading Javascript Gallery

Language: Javascript
Date: April 2005

Some months ago, through a long-forgotten source, I came across this technique for fading in images without using flash and I’ve been looking for an excuse to play around with such techniques. Eventually, some client work gave me that excuse.

This code works with a folder full of images named sequentially (1.jpg, 2.jpg, etc) and allows the user to cycle between them. The javascript 'slides' between one image and the next, resizing the first image to the dimensions of the second, and then fading between them.

You can find the code here.

Here is a sample of the gallery in action, using eight images from Calvin College's Rangeela 2005 event: