Is there a special way to have an animated (slide down) submenu on hover in the sidebar menu?
Do i have to do that with hiding/showing boxes or do i have to play with the hights of boxes because of animating them?
Thank for your help…
Hey @matthi_seebo
A bit late for the reply but I’ve managed to build an animated dropdown.
The trick is to calculate the height of the submenu to make the container’s height grow to that (custom javascript needed). The first thought would have been to set the height to auto. But transition does not work with this value.
I used workflow (on mouse enter/leave) and 2 variables (a boolean to control when I want the submenu to show, and a variable to hold the height)
I can provide you with a more detailed explaination if you want! 
1 Like
Hi JP,
yes, it would be nice, if you explain/ show a bit more. I think i understood, but maybe not 100%.
Do you work with show/hide or only with height? And, the Icon should turn around after hiding?
Thx
Matthi
Will do !
Only the height so that the animation works.
The rotation can be animated too
Here you go!
Forgot to mention, butI have a condition on the transform property of the icon:
if(isOpened,"rotateZ(0)","rotateZ(-90deg)")
2 Likes
Hi JP,
This was awesome - video was helpful but i think a couple things were missed ( pass through condition workflow, classes) i followed along as best I could.
Possible to get some tips on the below issue?
Hey @shamir
Pretty hard to tell with just a screenshot. But the height of the submenu is either not correct or not well positioned. You’d need to check both and see where the problem is coming from. For that, you can add console.logs to verify the values at each step
Why does the dropdown-menu component have a arrow that allow you to nest components inside ?
How can we make that work ?
You need to use a dropzone
That was helpful.
Thank you Sir. !
1 Like