Top Bar and menu background color 50% transparent

janosklak · July 2016

How to make the transparency of the background-color Top Bar and menu more opacity 40%?

BETHEME: B&W

Header Style: fixed

Albert · July 2016

Hi,

please send us link to your own site where you would like to do this first so we can have a look on it.

janosklak · July 2016

http://www.jk-foto.ch

Albert · July 2016

Ok. So to make header less transparent, you need to use an extra css:

.header-fixed #Top_bar { opacity: 0.4 !important; }

janosklak · July 2016

Hello, thank you for the answer.

I entered the line at Muffin Custom CSS. Unfortunately it did not work.
If I enter it at the standard editor it works.
But I want that only the background-color is more transparent, not the logo and not the menu...

Would it work?

Albert · July 2016

http://pasteboard.co/ez3a1OJYy.png - this is how transparency for the Top Bar works. You can not set this transparency other way. It is the proper behave that logo and menu would be more visible as well because it's how it works.

janosklak · July 2016

Hi thank you for your commitment.

The hamburger menu is now unfortunately in the background behind the content. It is no longer be selected when you scroll down.

How can i put the menu forward again?

regards

Albert · July 2016

Please show us how it looks like on your end because we didn't noticed anything wrong.

janosklak · July 2016

http://pasteboard.co/Bqd7qEB5.jpg

Hello,
the hamburger menu is under the content ... That menu should be in the foreground ... with the code " .header-fixed #Top_bar { opacity: 0.4 !important; } " is the menu displayed in the background ...

Albert · July 2016

But it doesn't look the same on our side. If you look at http://pasteboard.co/BNpNmKup.png you see how it really looks like.

janosklak · July 2016

but if you scroll down, the hamburger menu disappears into the background...

Albert · July 2016

But it's in front of the menu bar even if it's sticky what you can see on the following screenshot http://pasteboard.co/Diwylb1p.png

FD1224 · December 2016

Hello,

Is it possible to do this without effecting the text colour?

Copied the above code and it works fine. I just want the text darker.

Albert · December 2016

@FD1224 If you want the text darker, just increase opacity value.

FD1224 · May 2017

@muffingroup - I want the opacity value to be 0 (So there's no visible header) but keep the text visible. Is this possible?

Bryan · May 2017

Please send a link to your page!

FD1224 · May 2017

http://www.nuigmc.com/maamturks

Bryan · May 2017

Please use this css

 .header-fixed #Top_bar {
 	background-color:transparent !important;
 }
 .header-fixed #Top_bar {
	box-shadow:none !important;
}

naghizadehsh · July 2017

@muffingroup How to make the transparency of the background-color menu? i used CREATIVE HEADER .
I entered the line at Muffin Custom CSS. Unfortunately it did not work.

my site: rastin.ac

and sample site:

http://dprlaw.ir

Bryan · July 2017

To make the header transparent, please go to theme options>global>general and check the option there.

naghizadehsh · July 2017

@muffingroup I checked the transparent in theme options, but it did not work!

Bryan · July 2017

This is the side menu, it will not be transparent.

Top Bar and menu background color 50% transparent

Comments