Es gibt ein tolles Tutorial auf CSS Play, das reines CSS für Flipbook-ähnliche Animationen verwendet. Die zugrundeliegende Theorie besagt, dass ein großer Stapel von „Folien“ übereinander liegt. Darauf befindet sich eine Reihe von hohen rechteckigen „Scheiben“, die aus einzelnen <a>-Elementen bestehen. Jede der Folien wird knapp außerhalb des Divs herausgeschoben und der Überlauf verborgen. Wenn dann die :hover-Zustände auf den einzelnen <a>-Elementen aktiviert werden, werden die entsprechenden Folien zurückgeschoben, nicht unähnlich wie bei einem typischen CSS-Rollover. Das Ergebnis ist, dass das Bewegen der Maus über das Div verschiedene Folien auf eine wirklich unterhaltsame und süchtig machende Weise aktiviert.
Dieser Effekt ähnelt dem neuen „Skimming“-Feature in iMovie ’08 unter OS X. Ich wette, mit dieser Technik ließen sich coole Effekte mit sequenziellen fotografischen Bildern erzielen.
Es gibt ziemlich viel repetitiven Code und fest kodierte Pixelgrößen, daher könnte dies ein cooles Projekt sein, das man mit Javascript angehen könnte, um dynamisch ein Flipbook mit beliebiger Bildgröße zu erstellen.
