Rotating Product images so they look like there merging into a differnent view

Question

Imagine a page with three thumbnails on of differnent product views. When you click on a view the main image div would quickly transition into the new view.

Say it was a shoe i was photographing and it had a sole view, top view and side view.

My question is is there any way of giving the illusion of a spin e.t.c from one view to another when its clicked on? So not a straight change of image but a transition that works quickly to give the illusion of a morph almost.

Any ideas would be greatly appreciated.

Answer 1

What you are asking for sounds sort of like Tweening. One variation on this is Morphing which provides a series of transitions from one still to another. This site has a tool that generates intermediate images and might be useful for filling in the gaps between the images you currently have. Then some standard form of fadeshow would give the appearance without incurring the computational overhead on every page load. JavaMorph is a Java applet that can do this inplace in realtime. Note: none of this was tested and no images were damaged in the making of this answer.

Answer 2

Peter is right - just use morphing: You can image this effect in 2 steps:

Morph from square to tiny rectangle (almost 1 width) - > replace content -> Morph again back to the same size.

Hope this helps :)