← View all entries

Fold & Unfold

When a friend requested a way to present a piece of print media online without losing the novelty created by its multiple folds, we weren't sure if CSS Transforms and Animations would suffice...

The animation primarily relies on CSS transforms triggered by javascript as one scrolls down the page.

Special attention had to be given to the inner folds as they overlap the upper layers when they're folded in. Here we're opting for hiding the most inner layers when not in view.