Demo: "3D" JavaScript Tile Flipping Photo Gallery

published:
2009.12.02
topics:
css
javascript
video

FlipBox is another LightBox clone (a JavaScript photo gallery tool) where the new twist is a fun "3D" tile flipping animation effect. It is much easier to demonstrate than to explain, so I decided to do my first screencast with audio (be gentle!) so I could show you what FlipBox is all about. Incidentally, Mac OSX 10.6 Snow Leopard has a great free screen capture tool built into QuickTime. Sorry in advance if the volume is a little low. Real action starts at 0:45:

More About FlipBox

FlipBox is jQuery-based and makes use of my rotate3Di plugin to create a 3D-like isometric tile flipping effect using the CSS3 transform property currently only supported by Safari, Chrome, and Firefox 3.5+. (That's another reason why I wanted to record a video demo.) If you happen to have an awesome web browser, you can check out a live demo of FlipBox.

In it's current state, with only a little preparation by the user, FlipBox is already a simple to use LightBox-like tool. There's a few other demos with this concept I hope to put together, and I would also like to write proper documentation and do a release.