SkillAgentSearch skills...

FullscreenLayoutPageTransitions

This responsive layout is based on an initial grid of four boxes. Once a box is clicked, it gets resized to fullscreen and the other boxes scale down and fade out. In the work section we experiment with another transition which is to show a panel by making it appear from the bottom while scaling the current one down. To see it in action, open the work section and click on one of the portfolio items and navigate through them.

Install / Use

/learn @codrops/FullscreenLayoutPageTransitions
About this skill

Quality Score

0/100

Supported Platforms

Zed

README

FullscreenLayoutPageTransitions

This responsive layout is based on an initial grid of four boxes. Once a box is clicked, it gets resized to fullscreen and the other boxes scale down and fade out. In the work section we experiment with another transition which is to show a panel by making it appear from the bottom while scaling the current one down. To see it in action, open the work section and click on one of the portfolio items and navigate through them.

article on Codrops

demo

Licensed under the MIT License

View on GitHub
GitHub Stars731
CategoryDevelopment
Updated29d ago
Forks159

Languages

JavaScript

Security Score

80/100

Audited on Feb 26, 2026

No findings