Change menu dropdown from hover to click.
By Matt Smela on Monday, 02 April 2018
Posted in General
Likes 0
Views 853
Votes 0
Hello. On the Vanilla template on our site we have a dropdown user menu in the menu position at the top of the page.

By default it drops down when you hover over it. Is there a way to change that so it only drops down if clicked? (Depending on the page view the hovering dropdown covers some notifications.) Thanks!
Hey there,

I've checked with our designer regarding this, actually that is no simple way to change this behaviour.

If change the hover to click behaviour, it needed to use Javascript to define the class name when the user click on that menu, then inject the new class name 'dropdown-menu-active' on that menu div HTML, and use CSS to show that dropdown menu.

When the user click again, remove 'dropdown-menu-active' this class name from the menu div HTML, so it will hide the dropdown menu.
Arlex Wong
·
Monday, 02 April 2018 10:54
·
0 Likes
·
0 Votes
·
0 Comments
·
Thank you!
Matt Smela
·
Monday, 02 April 2018 18:50
·
0 Likes
·
0 Votes
·
0 Comments
·
Thanks for understanding.
Arlex Wong
·
Monday, 02 April 2018 19:43
·
0 Likes
·
0 Votes
·
0 Comments
·
View Full Post