Menu and Thumbnail Stack Animation

Publikováno: 22.9.2021

An animation on a vertical image stack for a menu that expands to arrange the stack items on a horizontal line.

The post Menu and Thumbnail Stack Animation appeared first on Codrops.

Celý článek

Today I’d like to share a little menu animation with you. It’s just a simple proof-of-concept to explore how to animate a vertical image stack into a horizontal one. This is incorporated in a menu that also expands its items letter by letter to add some interesting motion.

The initial view is the menu and when we hover an item, the vertical stack appears in the back of the menu with a glitch animation. It changes depending on the current item hovered:

When we click on an item, the letters and the decorative circle expand while the thumbnails of the stack rearrange from a column into a row of images:

The whole motion in action:

I hope you like this demo and find it inspirational!

The post Menu and Thumbnail Stack Animation appeared first on Codrops.

Nahoru
Tento web používá k poskytování služeb a analýze návštěvnosti soubory cookie. Používáním tohoto webu s tímto souhlasíte. Další informace