How to implement the animation described below?

Question

css

It is necessary that the elements that are inside the block are hidden when the size of this block is reduced.
cuberto.com - on this site, when hovering over a burger, the text appears inside the menu borders
Solution - overflow: hidden

Answer 1

Depends on what is causing the resizing. If this is a breakpoint in media queries, write the appropriate animation rules for the necessary elements, if this is caused by the work of scripts - it depends on the logic, you can, for example, check the dimensions, and when the desired value is reached, add some class to the element to which to attach the necessary animations .
If this is not enough, describe the situation in more detail.