Javascript image zoom/pan on Apple website?

[joshysquashy]

On the online store they now have a special (javascript?) zoom/pan script for the image galleries.

If you look on the iphone dock page, there is a good example on this.

In its original state, you get text with a large thumbnail and several small thumbnails. When you click, it zooms to take up the width, and the description disappears. Clicking once more super zooms, so you can pan.

Sounds complicated, but if you visit the link you will see it is very nice!

So, my question: how did they do it? Is it free open source javascript like usual? If so, goody goody!!! I want to steal/borrow it!!!

Perhaps this was custom made for their website however, or maybe someone else has made a similar script? I have used lightbox before, it is nice, but somehow I prefer this.


So can anyone see which javascript is making it work? Can anyone find a tutorial for this?

 

[angelwatt]

Looks to use the Dojo JavaScript framework. I could probably come up with a similar script if given enough time (not volunteering) as I've done lightbox-style scripts. Here it looks like you would make use of the CSS overflow and basic JavaScript dragging functions. I think that is new functionality for the site. Looks like they're trying to mimic some of the iPhone interface feel.

Edit:
I found one script called ShiftZoom.

 

[joshysquashy]

Looks to use the Dojo JavaScript framework. I could probably come up with a similar script if given enough time (not volunteering) as I've done lightbox-style scripts. Here it looks like you would make use of the CSS overflow and basic JavaScript dragging functions. I think that is new functionality for the site. Looks like they're trying to mimic some of the iPhone interface feel.

Edit:
I found one script called ShiftZoom.

Yea, what I particularly liked is how the image caused other content around it to change, it "steals focus". I haven't come across an image zoomer that doesn't separate full images from the content.

Thanks for looking.