Interlude

Astro starter for page transitions

21 transitions

Back

03 (overlays)

columns

Bars rise one after another to cover the page, then carry on up in the same order.

On the click, five bars rise from the bottom, each a beat behind the last (three on phones). They stay while the next page loads, then carry on up in the same order, so the screen clears like a row of blinds, and the new content comes in. Going back, they start from the right.

Each bar is a panel as tall as the screen, starting a little after the one before.

File
src/transitions/columns.ts

Its settings are at the top of the file.