[Resolved] No menu toogle Icon (Hamburger Menu) when using sticky primary navigation

Home Forums Support [Resolved] No menu toogle Icon (Hamburger Menu) when using sticky primary navigation

Home Forums Support No menu toogle Icon (Hamburger Menu) when using sticky primary navigation

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #895355
    Ender

    I use this code on specific pages to have a sticky primary navigation:

    .page-id-2943 #site-navigation, .page-id-1531 #site-navigation {
          position: -webkit-sticky; /* Safari */
          position: sticky;
          top: 0;
          opacity: 0.95;
    }
    
    .page-id-2943 #mobile-header, .page-id-1531 #mobile-header {
          position: -webkit-sticky; /* Safari */
          position: sticky;
          top: 0;
          opacity: 0.95;
    }

    It works for Desktop and Mobile. But on the mobile version the menu Toogle Icon (Hamburger Menu) disappears. What I make false?

    #895424
    Leo
    Staff
    Customer Support

    Hi there,

    Any reasons why you don’t want to use the built-in sticky navigation?
    https://docs.generatepress.com/article/sticky-navigation/

    If you only want it on one page, you can use this filter:
    https://docs.generatepress.com/article/option_generate_menu_plus_settings/#sticky_menu
    https://docs.generatepress.com/article/option_generate_menu_plus_settings/#example

    Let me know πŸ™‚

    #895614
    Ender

    Yes, I am familiar with this function. However, it does not change the fact that the “Close” icon is not visible in the mobile view.

    In the desktop view there are no problems. Only problems, when i am in the responsive mode: i can click to the burger menu, but the close button is not visible.

    #895628
    Ender

    I think i found now a solution with z-index

    .page-id-2943 #mobile-header, .page-id-1531 #mobile-header {
          position: -webkit-sticky; /* Safari */
          position: sticky;
          top: 0;
          opacity: 0.95;
          z-index: 9999999999999999999999;
    }

    Hope this is html-valid πŸ™‚

    #895633
    Leo
    Staff
    Customer Support

    If you use the default sticky navigation, the close button should definitely be visible.

    Glad you found a solution anyways πŸ™‚

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