How to remove in-built mega menu "memory effect"

How to remove in-built mega menu "memory effect"

hip280
Excursionist
21 0 2

Hi for shopify in-built mega menu, I noticed that it does remember which item inside the mega menu

was last clicked. As a result, there is an underline on the last item that was clicked. I managed to removed the underline on the last item by using CSS,

.mega-menu__link {

   text-decoration: none;

}

 

But actually, this just cosmetically remove the underline. The menu still remembers which was the last item clicked, as the on hover behaviour is different for an item which was clicked and an item which was not clicked.

Is there any way, to remove this memory effect, so when the mouse hover over the mega menu it has

consisten behaviour, regardless of whether and item is "active" or "not active", if this is the correct way to describe it. Thank you.

 

 

Replies 2 (2)

GadgetsNoob
Shopify Partner
35 4 6

Explore these selectors here download.png

hip280
Excursionist
21 0 2

Hi thank you for the reply and tips. 

I have tried and I found the below to work. By removing all the underline at various places,

the menu will look like it has no memory on where it was clicked.

 

.mega-menu__link--level-2 {
text-decoration: none;
}
.header__active-menu-item {
text-decoration: none ;
}