Docs

[kkendall2010]

Hi!

I’m trying to achieve the following:
1. Transparent main menu background, No adjustments to text
2. No transparency on the drop downs or on the text
3. Remove white border from menu
4. Remove transparency when scrolling

The current code I found to make any adjustments is the following:
.x-navbar {
background-color: #63666A !important;
opacity: .6;
}

But that changes the menu as a whole, I’ve looked through the forum and have tried the various options but all I can get is a totally transparent background.

Any help will is greatly appreciated!

[kkendall2010]

This reply has been marked as private.

[Joao]

Hi There,

Please use this code instead:

.x-navbar {
    background: rgba(0, 0, 0, 0.6);
     border:0;
     box-shadow:none;
     position: fixed;
     width:100%;
}
.x-navbar .sub-menu {
 background: rgba(0, 0, 0, 1.0);
}

.sub-menu li a:link {
       background: rgba(0, 0, 0, 1.0);
}

.x-navbar .sub-menu a:hover {
 background: rgba(0, 0, 0, 1.0);
}

.x-navbar-fixed-top-active .x-navbar-wrap {
    margin-bottom: 0px;
}

Hope that helps,

Joao

[kkendall2010]

Worked quite well, but the white border on the top of the menu remains, any way to remove that?

[Rahul]

You’re welcome. Let us know if you need any more help from us!

Cheers

[kkendall2010]

Update: Any way to remove the white border from the top of the menu?

Also, when I scroll down it changes to white (not the color I’d want), but then when I scroll back up the menu remains white, doesn’t change back to transparent.

[Thai]

Please add the following CSS:

.x-logobar {
    border: none;
}
.x-navbar {
    background-color: rgba(99, 102,106, 0.2) !important;
}
.x-navbar.x-navbar-fixed-top {
    background-color: rgba(0, 0, 0, 0.7) !important;
}

Hope it helps 🙂

[kkendall2010]

Perfect. Thank you so much! 🙂

[Rahul]

You’re welcome!

[Author]

Posts