Docs

[Easyads88]

I have used this css code to correct the fixed navbar on mobile devices.

media (max-width: 979px) {
.x-navbar-fixed-top, .x-navbar-fixed-left, .x-navbar-fixed-right {
position: fixed;
}
}

It worked well, but now a portion of my slide show (below my masthead) is being obstructed by the fixed navbar, after I scroll up or down. Is there any way that i can correct this from happening?

pic#1 is what it should be, but pic#2 shows the portion that is being blocked once you scroll

[Thai]

Hi There,

The screenshots look the same.

Could you please send us with the other screenshots?

Thanks.

[Easyads88]

They are not the same pics. Please observe the top where one pic includes the words:”What would you like to find:”, while the other one does not, because it is obstructed by the navbar.

please view on a mobile device or dimensions:

http://tourmobile.info

[Rue Nel]

Hello There,

Thanks for the updates! It seems that you are using an older version of X. X 4.5.2 is now available in automatic updates! This release contains hotfix for several issues so be sure to check out the changelog. Please do update to the latest version. After doing the updates, always remember to clear all caches when updating so that the code from the latest release is always in use. This will help you to avoid any potential errors.

Please let us know how it goes.

[Easyads88]

I have updated, and cleared caches, but it still didn’t fix my problem.

Please help…are their any other suggestions or code that will fix this minor glitch?

[Rue Nel]

Hello There,

Thanks for the updates! I have logged in to your site and went ahead to fixed the issue. I ended up adding this custom JS in your customizer.

jQuery(function($) {
  var $body   = $('body');
  var $navbar = $('.x-navbar');
  if ( $body.hasClass('x-navbar-fixed-top-active') && $navbar.length > 0 ) {
    $(window).scroll(function() {

      if ( $(this).scrollTop() >= 120 ) {
        $navbar.addClass('x-navbar-fixed-top');
      } else {
        $navbar.removeClass('x-navbar-fixed-top');
      }
    });
  }
});

After I made the changes, Since you have installed a caching plugin W3 Total Cache, I also cleared the plugin cache before testing your site. This can cause the changes to not take place on the front end. It will eventually show up when the cache regenerates, but it’s not ideal if you’re looking to see your changes immediately. Caching plugins are best to turn on only when you’ve finished building the site.

If you need anything else we can help you with, don’t hesitate to open another thread.

[Author]

Posts