A details with boxes that out in an irregular grid. The grid items get revealed individually with delays from the right corner of the page.

SlideOutBoxMenu_featured  - SlideOutBoxMenu featured - Slide Out Box Menu | Codrops

Today we’d like to share a little menu with you. The idea is to reveal the boxes of a grid individually from the top right corner of the page similar to the Expanding Grid Menu we did a while back. The inspiration for this effect and for the slideshow layout comes from Adrián Somoza’s design and Zhenya Rynzhuk’s Dribbble shot. The animations are powered by TweenMax.

Attention: Note that we use modern CSS properties that might not be supported in older browsers.

SlideOutBoxMenu_01  - SlideOutBoxMenu 01 - Slide Out Box Menu | Codrops

For showcasing the menu, we’ve created a little slideshow. The menu opens when clicking on the + details button on the right side:

SLideOutBoxMenu02  - SLideOutBoxMenu02 - Slide Out Box Menu | Codrops

- advertisement - Slide Out Box Menu | Codrops

We hope you like this little menu effect and find it inspirational!

References and Credits


Source link


Please enter your comment!
Please enter your name here