If you are like me and use iPhoto, you probably like and respect the way when you move your mouse across a album, it scrolls through the pictures in it. I was even more impressed when I noticed they also did this on my me.com gallery, and by how fast it was. If you don't know what I am talking about, you can see Apple's me.com gallery example here. Simply move your mouse across any of the albums and you will see it scroll through thumbnails of the pictures.
Anyway, I figured it out, maybe this is not exactly how they do it, but probably pretty close (I didnt copy any Apple source).
First create a stacked image of all your thumbnails, basically one very tall image with each thumbnail right on top of each other, see apples example here.
Next create a div with the following style: (width & height should be the width and height of each individual thumbnail
Now put your image link inside this div with the following style:
Give your image an id, lets call it "myImage"
var lastMPos = null;
var changv = Math.abs(lastMPos - event.clientX);
if (lastMPos == null || changv > 60)
var element = event.element();
var current = element.style.top;
var cpix = parseInt(current.substring(0,current.indexOf('px')));
if (cpix != -800)
cpix = cpix - 400;
cpix = 0;
element.style.top = cpix + 'px';
lastMPos = event.clientX;
This script basically adjusts the top by the height of the individual images each time the mouse gives an event that was more than 60 pixels from the last event. You can adjust this based on the number of images in your strip and the height of your image.
Hope I saved you some time if you were looking for the same thing. I was thinking it would be cool to write a serverside utility that would stack a bunch of images on top of each other, because creating these strips manually can be a pain. Let me know if you know of such a utility out there.