Docs

[cellosimons]

Hi!

I have another question this time regarding to the breadcrums menu. I’d like it to behave the same way as the main menu (always visible) when I scroll down the Forum page, for example, instead of disappearing.

The site is http://www2.darkmyst.org/

Thanks a lot!

[Paul R]

Hi,

Thanks for writing in!

To achieve that, you can add this under Custom > Edit Global Javascript in the Customizer.

jQuery(function($) {
   $(window).scroll(function(){ 
        if($('.x-navbar').hasClass("x-navbar-fixed-top")) {
              $('.x-breadcrumb-wrap').addClass("x-breadcrumb-fixed-top");
        }else {
              $('.x-breadcrumb-wrap').removeClass("x-breadcrumb-fixed-top");
        }
    });
});

Then add this in Custom > Edit Global CSS in the customizer

.masthead .x-breadcrumb-fixed-top {
    position: fixed;
    z-index: 99999;
    top: 60px;
    width: 100%;
}

Hope that helps.

[cellosimons]

Hi!! Thanks very much!

I’ve changed the top value and it works just fine on desktops.
For small devices, as the navbar desappears the breadcrumb remained fixed, so I’ve added the following code to fix the navbar and adjust the breadcrumb bar.

@media (max-width: 767px)
{.masthead .x-breadcrumb-fixed-top {
position: fixed;
z-index: 99999;
top: 50px;
width: 100%;
}
}

@media (max-width: 767px)
{.masthead .x-navbar-fixed-top {
position: fixed;
z-index: 99999;
top: 0px;
width: 100%;
}
}

But I have two issues:

1. I need to do the same thing for tablets.
2. I’m checking on Safari on an Iphone 5s and the navbar works kind of funny, it appears from the left and desapears as you scroll the page.

And one minor issue:
As I’m using Superfly for mobile, I have no problem with the breadcrumbs, but if you check it on a thinner screen on desktops (simulating mobile) the navbar displays but the breadcrumbs keeps fixed over the navbar menu.
Is there a way to hide the breadcrums when you toogle the menu?

Thanks again!
Marcelo

[cellosimons]

Another thing, the breadcrumbs stays on top of the second level menu of the navbar
thanks!

[Paul R]

Hi Marcelo,

1. Please change 767 to 979

2. Can you provide us a video on how it looks in your end.

3. To hide it, you can add this under Custom > Edit Global CSS in the Customizer.

@media (max-width: 979px) {
.masthead .x-navbar-fixed-top {
    z-index: 999999 !important;
}
}

Thanks

[cellosimons]

That works perfectly, thanks a lot!

I’ll send you a video ASAP

Two things please:

1. Another thing, the breadcrumbs stays on top of the second level menu of the navbar
thanks!

2. I’ve adde some items to the main manu and the last two (my account and the bbpress menu) are not aligned with the others

thanks for your patience, I hope this could help other users too.

[Nabeel A]

Hi again,

1. To fix the breadcrumbs display issue, use this code:

.masthead .x-breadcrumb-fixed-top {
    z-index: 99 !important;
}

2. Please add the following code in your Customizer to fix the alignment issue:

.menu-item-has-children a {
    padding-top: 21px !important;
}

Let us know how this goes!

[cellosimons]

This works great!! Awesome support!!

Here’s a link to the video of the odd behavior of the menu on mobile.
If you keep the button pressed a little longer the x menu appears or disappear, but if you just touch the button the superfly menu also appears.
Then there’s the other thing when scrolling, the bar goes kinda crazy. Maybe there are not compatible, I don’t know.

https://drive.google.com/file/d/0B89vo0j8ywr6aEc0d0VOejNha0U/view?usp=sharing

Thanks!

[Rupok]

Hi there,

I have tried with Mobile and only the Superfly is appearing on my end for mobile. Not sure why you are getting this on your end. Would you try from a different device to test?

Cheers!

[cellosimons]

Hi!

I’ve tested it on an iphone 3gs (a piece of museum but still works) and I have the same issue with the menu, if you press a little longer the x menu pops up. It doesn’t do the crazy disappering thing, though.

Maybe the best is let the client choose between the xmenu or the superfly left-top aligned and fixed menu.

Thanks again!

[Lely]

You’re welcome!

Do let us know if you still have questions.

Cheers!

[Author]

Posts