For this site users seem to have difficulty finding the site's content that is accessible through the 'Data' drop down menu on the top left.
To improve this I would like to have this drop down menu expanded by default – but only on the front page.
By this older (not WordPress related) StackExchange question (that is including a JSFiddle) and some other comments I have learned that I should use jQuery. I tried my best but I have not been able to get it working at all on my site.
What are the CSS elements on my site that I have to address in the JQuery code? And where should I put this code? Would somebody be able to help me?
Edit:
Thank you very much user49916! This works! The problem that I encountered was that the second level children were also expanded by default. To hide them and then only show them on hover I added this:
/*Make the drop down menu expanded by default – on the front page*/
.home ul#menu-all-descendants-as-submenus li ul {
left: 0;
}
/*Make the drop down menu expanded by default and hide the sub-children – on the front page*/
.home ul#menu-all-descendants-as-submenus.menu li ul ul {
left: -999em;
}
/*Make the drop down menu expanded by default and show the sub-children on hover of menu – on the front page*/
.home ul#menu-all-descendants-as-submenus.menu li ul li:hover>ul {
left: 0;
}