I’m trying to develop the following vertical navigation. If parent item has children, show those children in a smooth transition (i’ve used translateX) in a column next to the first one. So for the first level of children, show a new column.
But if those children have child items, you need to show them under each of its parents. From level 2 children, no column layout.
I’ve already created a small poc: https://codepen.io/dennisperremans/pen/MWNvVod But still a lot of issues:
- in the case of lots of items a scrollbar is shown (which is a must in our case). But the scrollbar causes that I can’t hover the second column because. It disappears before I can even hover it.
- the transition animation isn’t visible. Probably because of the
display: none;on the.menu .menuelement ?
General question:
- What about the mobile navigation? That probably should be done with Javascript because hover isn’t possible.
You need to sign in to view this answers
Leave feedback about this