Shop Categories

X

Change Position of nobile Nagivation

Home Forums Agama Pro Change Position of nobile Nagivation

Topic Resolution: Resolved
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #9501
    PYUREcrew
    Participant

    Hello Support,
    i would like to have only a mobile top navigation.
    when i open the website, the website title and menu-bar is in front of the background images and layerslider-buttons. when i scroll down, it changes to top navigation.
    my wish would be:
    only a static menu bar on the top: on the left our website title, on the right the menu-bar.
    How can i do that?
    thanks 🙂

    • This topic was modified 4 years, 5 months ago by PYUREcrew.
    #9503
    PYUREcrew
    Participant

    here is a visualization of what i want: https://www.dropbox.com/s/5oqfxks4t7yyv5j/Mobile.png?dl=0

    • This reply was modified 4 years, 5 months ago by PYUREcrew.
    #9513
    Zex
    Moderator

    Hello, PYUREcrew!

    Based on your current settings, next code should work for you:
    (Insert the code in Customizing->General->Additional CSS)

    https://prnt.sc/jus5qa

    @media (max-width:994px) {
    .sticky-header.sticky-header-shrink {
     position: fixed!important;	
    }   
    nav.mobile-menu {
     position: fixed!important;
     width: 100%;
     top: 60px;
     height: 250px;
     overflow: auto;
     z-index:9999;
    }
    
    h1.site-title a {
     width: 80%!important;
     text-align: left!important;
    }  
    .mobile-menu-icons{
     width: 20%!important;
     clear: none!important;
     text-align: right!important;
    }	
    }

    A search button can be enabled only in the primary navigation menu.

    Regards

    #9521
    PYUREcrew
    Participant

    hey zex,
    thanks, that worked! 🙂
    on some sub-pages, like http://www.pyure-crew.net/events we use the logo instead of the title.
    in this case it doesn’t work yet, as the logo is still in the middle and above the menu.
    can you please add the code, so that the logo will be at same position like the title?

    #9523
    Zex
    Moderator

    Hi,

    Replace the code that I gave you in the previous post with the following:

    @media (max-width:994px) {
    .sticky-header.sticky-header-shrink {
     position: fixed!important;	
    }   
    nav.mobile-menu {
     position: fixed!important;
     width: 100%;
     top: 60px;
     height: 250px;
     overflow: auto;
     z-index:9999;
    }
    
    h1.site-title a {
     width: 80%!important;
     text-align: left!important;
    }  
    
    .logo{
     float: left!important;
    } 
    
    .mobile-menu-icons{
     width: 20%!important;
     clear: none!important;
     text-align: right!important;
    }	
    }

    Regards

    #9528
    PYUREcrew
    Participant

    perferct.
    one last question about the mobile menu.

    as it opens, it doesn’t open completey. i have to scroll down in the menu to get to last menu point, which is kind of not working very well, because the background scrolls down!
    let’s say most of the time if i try to scroll down the menu, the background react, but not the menu, only sometimes i’m able to scroll down in the menu, but I don’t know on what it depends…

    to avoid that people are not able to navigate to the lowest menu points, i would prefer the menu to open completly and that the scroll funtion for the menu works if i touch the menu – and that the scroll funtion für the background works, if i touch the background.

    thanks for your help!

    #9532
    Zex
    Moderator

    Try to go with the following code:

    @media (max-width:994px) {
    .sticky-header.sticky-header-shrink {
     position: fixed!important;	
    }   
    nav.mobile-menu {
     position: fixed!important;
     width: 100%;
    }
    
    h1.site-title a {
     width: 80%!important;
     text-align: left!important;
    }  
    
    .logo{
     float: left!important;
    } 
    
    .mobile-menu-icons{
     width: 20%!important;
     clear: none!important;
     text-align: right!important;
    }	
    }

    Regards

    #9536
    PYUREcrew
    Participant

    perfect, topic solved! thanks <3

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