2

I try to archive a certain effect with js/jQuery: The Apple Mac OS X Coverflow Coverflow http://img69.imageshack.us/img69/8716/bildschirmfoto20100202u.png effect which you can choose within finder. Can you point me to a gently & smooth working plugin? I love #roundabout for jquery but unfortunately they don't support that effect. I also tried some of the linked plugins of this post: Apple Cover-flow effect using jQuery or other library? but they are all crappy and just do not work smooth in firefox (not to mention IE).

Thanks

Community
  • 1
  • 1
Max
  • 1,143
  • 3
  • 15
  • 21

4 Answers4

2

This is a cross-browser implementation of Cover Flow: http://luwes.co/labs/js-cover-flow/

The primary mode works in HTML5 (JavaScript/CSS) and it has a fallback for older browsers in flash. It supports mobile, you can flip through the covers with a simple swipe gesture.

It is hardware accelerated in the latest webkit browsers.

Tested on: Safari, Chrome, Firefox, Opera, IE8+, iPad, iPhone

luwes
  • 854
  • 11
  • 19
  • thanks luwes. but thats not the coverflow effect. You don't get a real 3d-impression (tested in Chrome 21). The images just squeeze together, but do not turn and slide back-right or back-left. – Max Aug 13 '12 at 05:29
  • thanks for the feedback Max. Then there are some strange differences going on between our setups. On my end both on OSX and Windows with Chrome 21 the 3D effect is working. Are there any 3D transforms working in your browser? http://www.webkit.org/blog/386/3d-transforms/ – luwes Aug 21 '12 at 17:25
  • hey luwes. wow, no its working. i am still on chrome 21 (windows 7). coool! – Max Aug 24 '12 at 14:35
1

I tried for a while looking for the same thing with javascript/jquery. Could find anything with the turning effect. At the end I used a Flex component by Sebastiaan Holtrop

You can see the demo app here - the controls on the side just show you how you can customize the component. Very easy to customize.

Works quite smoothly. It only took me a couple of days to get it to work for me - without knowing anything about Flex before.

nivcaner
  • 1,194
  • 1
  • 12
  • 22
  • thanks for the hint. looks well done. even though I like to omit any flash stuff. In my project, I went with a normal carousel effect brought by roundabout. – Max May 26 '10 at 10:37
1

Check out momoflow

True coverflow effect, very performant on Webkit (Safari and Chrome) and Opera, ok on Firefox.

epascarello
  • 204,599
  • 20
  • 195
  • 236
0

It seams as if the real visual effect hasn't been archived at all yet as it turns out to be quite difficult. You probably need too use some canvas/transformation technique for it. jQuery planing/development wiki says following: http://jqueryui.pbworks.com/Coverflow

Max
  • 1,143
  • 3
  • 15
  • 21