Solved

Adding hover "animation" or underline/bold in sub menu collection

koloset
Tourist
11 0 3

Hello.

I have added some hover "animation" in the main menu (check attached print screen).
hov.jpg
I would like to do the same in the sub menu collection, so the customer can easily see where he/she is (check attached print screen #2). Thanks!
hover2.jpg


web: www.koloset.si
Theme: Venture

Accepted Solution (1)

Raj-WebDesigne
Shopify Partner
60 16 14

This is an accepted solution.

Add This Css in your Theme.css File 

.site-nav__link:hover:after,a.meganav__link:hover:after {
    width: 100%;
}
.site-nav__link:after,a.meganav__link:after {
    position: absolute;
    width: 0;
    height: 2px;
    bottom: 0;
    background: #a5cd39;
    content: "";
    left: 0;
    right: 0;
    transition: width .3s ease 0s, left .3s ease 0s;
    margin: 0 auto;
}
a.meganav__link{
    position:relative;
    display: inline-block;            
}

If you require further help to optimize your store, please don’t hesitate to reach out.


This contribution will always benefit you and you will get my full help easily and you can contact me easily.


Your Willpower Contribution Link

:- Contribution

Contect On My Mail :-Mail@gmail.com


View solution in original post

Replies 2 (2)

Raj-WebDesigne
Shopify Partner
60 16 14

This is an accepted solution.

Add This Css in your Theme.css File 

.site-nav__link:hover:after,a.meganav__link:hover:after {
    width: 100%;
}
.site-nav__link:after,a.meganav__link:after {
    position: absolute;
    width: 0;
    height: 2px;
    bottom: 0;
    background: #a5cd39;
    content: "";
    left: 0;
    right: 0;
    transition: width .3s ease 0s, left .3s ease 0s;
    margin: 0 auto;
}
a.meganav__link{
    position:relative;
    display: inline-block;            
}

If you require further help to optimize your store, please don’t hesitate to reach out.


This contribution will always benefit you and you will get my full help easily and you can contact me easily.


Your Willpower Contribution Link

:- Contribution

Contect On My Mail :-Mail@gmail.com


koloset
Tourist
11 0 3

Wow, that was fast! Works great! Thanks Raj!

Take care.