[Resolved] Secondary Menu Customizations

Home Forums Support [Resolved] Secondary Menu Customizations

Home Forums Support Secondary Menu Customizations

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1524431
    Anthony

    I need help with two things regarding the secondary menu.

    1: I was hoping to make the mobile secondary menu to expand over the mobile header instead of pushing it down with it?

    2: I was also wondering how to slow down the expanding animation of the menu. I would love for it to expand, or open, slower.

    Thank you!

    #1524681
    Elvin
    Staff
    Customer Support

    Hi,

    1: I was hoping to make the mobile secondary menu to expand over the mobile header instead of pushing it down with it?

    2: I was also wondering how to slow down the expanding animation of the menu. I would love for it to expand, or open, slower.

    To achieve those, add this CSS:

    @media(max-width:768px){
    .secondary-navigation.toggled .main-nav>ul {
        position: absolute;
        width: 100%;
        background-color: #22561f;
        z-index: 100;
        animation: fadeInDown 0.7s ease-out;
    }
    
    @keyframes fadeInDown {
      from {transform: translateY(-100%);}
      to {transform: translateY(0%);}
    }
    
    .secondary-navigation {
        z-index: 100;
    }
    
    nav#mobile-header {
        z-index: 98;
    }
    }

    What this does is, it animates how the menu shows up so it comes down slower. You can play around w/ the animate: 0.7s value.

    Reducing its value speeds up the animation, assigning bigger value makes things slower. It’s counted in seconds. ๐Ÿ™‚

    A wise man once said:
    "Have you cleared your cache?"

    #1525136
    Anthony

    Works great! Thank you!

    #1525812
    Elvin
    Staff
    Customer Support

    No problem. ๐Ÿ™‚

    A wise man once said:
    "Have you cleared your cache?"

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.