cpreview

 

Hi guys. I’m making some more of my custom components available for download today. The Apple iTunes CoverFlow effect is one the nicest forms of visualizing albums and images that I’ve seen over the past few years and I’ve always wondered..could the effect be done using JavaScript and no Flash whatsoever?. The answer is yes and I’d like to share with you my new Pure JavaScript CoverFlow component (which doesn’t rely on jQuery, YUI or any other frameworks to work! :) . 

 

The effect is made possible using the HTML5 Canvas element which takes care of all the image processing work (eg. reflections and tilts etc). I’ve seen previous implementations that use PHP to achieve this but I think a true implementation should be able to do all of this at the client side – hopefully my version lives up to that.

 

For readers who haven’t checked it out before, the CoverFlow includes keyboard navigation, one-click flip and tilt access to any item in the stack, a built-in lightbox for viewing higher resolution images, HTML album previews and much more.

 

With release 2.0.1 one of the important things that have been addressed is increased cross-browser compatibility with Google Chrome 2.0 +, FireFox 3.5 + and Safari 4.0 also now supported. The newest version of the component can be downloaded from SourceForge via the link below. Please feel free to share it and let me know what your thoughts are on it.

 

Screencast:  Watch this component in action right here

Demo:  Launch the FireFox/Chrome/Safari compatible demo here

Download: Get the sources via SourceForge

New: You can also download an alternative version of the CoverFlow done using YUI right here.