Change menu to open upon hover - Craft theme

[kindred-haus]

I want to change my main menu to open when I hover over the title & keep opened when my mouse is still on the header. Once mouse leaves the header section, the menu will close.

My website: https://kindred-haus.com/

PW: KHaus2023

Basically, I want the menu to function like this website: https://mogutable.com/

Thank you!

[KabirDev]

Hi @kindred-haus,

To switch the mega menu in Shopify's Craft theme from click to mouseover, modify the theme's JavaScript. Replace the click event with a mouseenter event, and possibly add a mouseleave event to close the menu. Here's a sample code snippet:

$(document).ready(function() {
    $('.mega-menu-trigger').off('click').on('mouseenter', function() {
        $(this).find('.mega-menu-content').show();
    });
    $('.mega-menu-trigger').on('mouseleave', function() {
        $(this).find('.mega-menu-content').hide();
    });
});

Replace .mega-menu-trigger and .mega-menu-content with the actual selectors used in your theme.

[kindred-haus]

Hi @KabirDev ,

I don't have much coding experience, is it possible for you to be a little more specific/provide step by step instructions.

Thank you so much, really appreciate it!

[ShishirHelps]

Hi @kindred-haus 

Is your problem solved? If not I can provide a solution. Please let me know.

Best regards

Shishir Hasan | Shopify Website Developer

[kindred-haus]

Hi @ShishirHelps ,

I have not figured it out yet, please provide a solution.

Thank you!

[kindred-haus]

Update, I was able to create the mouse over action to access the drop down menu with another code I found through the community. But it's difficult to access the sub menu when I move my mouse over since the menu is left aligned. Once I move my mouse to the sub menu, the menu closes.

[kindred-haus]

Sorry another update, I was able to solve this! Now, is it possible to change

1. hover on sub menu, instead of it being an underline change to bold

2. move submenu text to align with menu header

Thank you!

[ShishirHelps]

Hi @kindred-haus 

Okay, Good to hear.

If you need any kind of help, will do just a knock. I'm able for Shopify design, development, and funnel building.

Best regards

Shishir Hasan | Shopify Website Developer