Public
- Public
- Network
- Groups
- Featured
- Popular
- People

a collection of photos — all different shapes and sizes, laid out in a puzzle-like pattern. A mouse moves over one image. Click. And the image grows bigger. The rest animate to scoot out of the way to make space. Click again, and the image gets smaller, while all the rest scoot back to where they started.

Download link

a collection of photos — all different shapes and sizes, laid out in a puzzle-like pattern. A mouse moves over one image. Click. And the image grows bigger. The rest animate to scoot out of the way to make space. Click again, and the image gets smaller, while all the rest scoot back to where they started.

Notices where this attachment appears

Embed this notice
Jen Simmons (jensimmons@front-end.social)'s status on Friday, 12-Apr-2024 06:15:34 JST Jen Simmons

I’ve been making demos of CSS Grid level 3 lately, to show off what putting masonry/waterfall-like layout support in CSS Grid can do. (I’ve got 16 demos and counting!)
Here’s one with that includes View Transitions, running in Safari Technology Preview 192.
What do you want to know about how masonry-like layouts could work in CSS Grid?

In conversation about 8 months ago from front-end.social permalink