Reply To: transition on a menu

[Atelierbram]

To be honest I like your first attempt better. And it certainly looks better then my first attempt.

First one is kind of easy to do really, trouble with the second transform: translate(Y) one, is the overlapping of the nested menu; can’t seem to have it come from under the menu-button. Tried z-index:-1, pseudo-element, nothing seems to work, so I give up for now.

I remember seeing on the internet effects in css where objects appear in a rhythm: tak, tak, tak and that’s the effect I would like to have.

Updated the Codepen’s with some slightly improved CSS , and added a tiny bit of delay on the transitions.

One thing I would like to recommend, – trying not to preach -, ( which is always tricky because, yes, I am Dutch after all), is trying to get your head around bem-syntax , or a similar logic with HTML and CSS. For having an ul, and child li with this same name ( .topmenu ), kind of defeats all logic.