Mobile Menu overlay

Support
#1

Hey guys and girls,

i have an issue with the mobile menu of x.
at the breakpoint of at least 979px width the normal horizontal menu changes to the mobile one. thats nice and works fine. but when i open it, it is just some kind of overlay and has no background. some times it has a background but when i scroll it disappears. so all in all no nice experience with mobiles on my website.

i fixed it some time ago but now some updates later its back again. is there a chance to fix it?

greets
ave

http://www.blitzdings-fotobox.de

#2

Hi there,

I tried checking your site but it seems to be inaccessible at the moment.

#3

wow :smiley: pls try again

#4

Hi There,

Please add the following code to Theme Options CSS

@media(max-width: 969px) {
.x-navbar .x-nav-wrap .x-nav > li > a {
 
    background: yellow;
}}

Hope it helps

#5

Hey Joao,

thanks for this code works fine. I didnt clearly describe the problem. The menu you open with the click on the button just flies over the image instead of moving it down. especially on a mobile (take a look on a mobile, it behaves different) if you scroll down the backgroundimage appears and if you stop touching the display the background disappears.

you got an idea?

#6

Hi,

To fix it, you can add this in Theme Options > CSS


@media (max-width: 979px) {
.x-navbar.x-navbar-fixed-top {
    height: auto !important;
}
}

Hope that helps.

1 Like
#7

Thanks paul.r this code fixed my problem. May I ask you if it is possible to set the code when you click the menu icon and unset if you toggle out the menu again?

thanks a lot anyway!

#8

Hi,

To achieve that, you can add this in Theme Options > JS

jQuery(function($){
  $(window).scroll(function(){
      if($(this).scrollTop()==0){
        $('.x-navbar').removeClass('x-navbar-fixed-top');
    }
  });
});

Hope that helps