Docs

[Dadparvar]

Hi,

We have some problems with UberMenu in responsive mode:

• When the responsive is activate and the “menu” button comes, when I click on it, it opens the menu, but there is no way to close it. When I again click on menu button, it reload the page. (of course there is an option to add Close button for sub-menu, but not the main first level menu)
• When I click on Menu button, it opens menu but the menu items are transparent. But I never set it to be transparent and in this way it looks bad mostly when the menu items come over the elements on page.
• When the responsive mode is activated (for example when we visit the site with mobile or in low size window) the header is not sticky any more and in order to find the menu, we should scroll to top to find the menu button. (but we set the menu to be fixed)

Any opinion on how to fix this will be appreciated.

[Christian]

Hey there,

1. Please add the code below in your Appearance > Customize > Custom > CSS.

@media screen and (max-width: 700px) {
.ubermenu-responsive.ubermenu {
    margin: 36px 0 0;
}
}

2. The Vanilla skin menu item background is transparent. Please switch to Vanilla Bar or other skins.

3. UberMenu doesn’t have a sticky feature. You will need to use there stick extension http://codecanyon.net/item/ubermenu-sticky-menu-extension/3904845

Thanks.

[Dadparvar]

1. Thanks. Fixed.

2. Thanks. Fixed. Just there is some additional spaces below the menu that I don’t where it is coming from (see the screenshot, I hovered on a menu item and it became in different color. So you can see how height is the menu. But below it there is near by 5 px white space that is not related to ubermenu, because when I change its color, the menu changes the color, but that space is still white. What should I do to remove it directly?)

3. Thanks ( 😐 a new extension for just adding a fixed functionality to menu? 😐 I don’t know why they don’t add it to the menu itself!)

[Nico]

Hi There,

Happy to hear that some are okay already.

Would you mind uploading the screenshot again. please share us your URL also we could check your setup.

Thanks.

[Dadparvar]

This reply has been marked as private.

[Paul R]

Hi,

Thank you for screenshot.

To get rid of it, you can add this under Custom > CSS in the Customizer.

.x-navbar-inner {
    min-height: 55px;
}

body.x-navbar-fixed-top-active .x-navbar-wrap {
    height: 55px;
}

.rtl ul:not(.x-nav):not(.x-comments-list):not(.products) {
    margin-bottom:0;
}

Hope that helps.

[Dadparvar]

Thanks

Perfectly works.

[Joao]

Great to hear it.

Let us know if you need help with anything else.

Thanks

Joao

[Author]

Posts