Interlude

Astro starter for page transitions

21 transitions

Back

12 (moving the page)

cube

The page is one face of a box: it pulls back, then the box turns over to the next page.

On the click, the page pulls back, still facing you, and waits there for the next one; if that takes a while, a loader shows at the cursor. Then the box turns over: the page rotates away and down, the next one comes round from above, and the box comes forward until it fills the screen. Each face darkens as it turns away. Going back, the next page comes round from below.

The two pages are still copies, set as two faces of a box as deep as the screen is tall, and turned with CSS 3D transforms.

File
src/transitions/cube.ts

Its settings are at the top of the file.