Interlude

Astro starter for page transitions

21 transitions

Back

11 (moving the page)

carousel

The page zooms out into a row of pages, the row slides to the one you chose, and it zooms in.

On the click, the page zooms out into a row of all the site’s pages, and waits there for the next one; if that takes a while, a loader shows at the cursor. Then the row slides to the page you chose, and it zooms in until it fills the screen. Going back, the row slides towards the page you’re going to, whichever side it’s on.

The row is one strip, moved and scaled like a camera. Only the page you’re leaving and the one you’re going to are copies of the real pages; the others show their name. The row is made from the links on the page (the LINKS setting), so for your own site, point it at your navigation.

File
src/transitions/carousel.ts

Its settings are at the top of the file.