Javascript dropdown list
I made a dropdown using JavaScript where the dropdown opens on mouse hover. Now when I use it in the sidebar, I would like to see the items below it instead of the dropdowns when I view the dropdown, I would like the items below it to move down to make room.
I was able to achieve this by removing the overflow in the CSS, however the problem is that when entering a webpage, the dropdown menu expands completely until I navigate through it with my mouse.
Leave the overflow: hidden in CSS.
Add style.overflow = "visible" to the element when you want the menu to appear and use style.overflow = "hidden" or style.overflow = "" on the element when you want it to hide again.
You need to get / calculate the height of the dropdown (assuming it's on a different level) and add that height to the base element of the menu item (checking if the dropdown is visible or not, of course).