Is there a way to autoscroll a longer list of submenu items in genesis?

[glenkg]

Hello,

On the secondary menu I have a menu with multiple submenu items. I had to add a scroll function on it. the scroll bar is next to the menu and scrollable with the mouse wheel. But is there a way it auto scrolls down when you hover on the lowest submenu in the viewable scroll box?

I found this, but i have been trying to translate towards the genesis secondary menu, but i have failed so far.

.sub-menu{
    overflow:hidden;
    max-height:0;
    height:auto;
    background-color:#D7D5D5;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.main-menu li:hover > ul{
    max-height:1000px;
}

Any help in the right direction would be appreciated. Thank you.

[Jelly4567]

If you're working with a WordPress site using the Genesis framework and you have a long list of submenu items, you might want to consider implementing an auto-scroll functionality for better user experience in Best drag Clicking Mouse . Here's a general guide on how you could achieve this:

[brycejune]

Hi glenkg,

Hope so you're doing well, when hovering over the lowest submenu in the viewable scroll box in the Genesis secondary menu, you can use the following CSS. Apply a similar structure to your submenu and use the max-height property for the transition.

.genesis-nav-menu .menu-item:hover > .sub-menu {
max-height: 1000px; /* Adjust the height as needed */
}
Make sure to replace .genesis-nav-menu with the appropriate class of your secondary menu. This CSS rule will trigger the submenu to expand with a smooth transition effect when you hover over the fire kirin menu item. Adjust the max-height value according to your design preferences.

I hope this helps!

Regards,
Bryce June

[Author]

Posts