html - Hover Colour making Headers unreadable -


I'm trying to get an effect like this website, when the content is hidden on it, then a yellow color The color of it consumes and color of the header change. When I tried to recreate this effect my headers became unreadable. Jsfiddle.net/m8z25

  .content1: hover, .content2: hover, .content3: hover, .content4: hover, .content5: hover, .content6: hover {background color: white; Opacity: 0.30; Transition: .2s; WebKit-Infection: .2s; Webkit-Infection: All 500ms Easy; } H1: Hover {Color: Black; } h2 {color: red; Status: Completed; Bottom: -10; Padding-left: 30; } h1 {color: black; }    

It is not 100% clear that what you are trying to achieve here ...

What can I tell? It almost becomes ineffective because you are adding opacity to the content container. It affects all the content (including the background) so that everything gets faded

What you have depends on the content container (your site background).

On the site where you do not use ambiguity to change the demo-ed anything, I think it only changes the color of the background with a light purple dark purple color

Opacity: 0.30; and try updating the background / text color instead. P> Use the opacity to change versus color by looking for example ...

Comments

Popular posts from this blog

Java - Error: no suitable method found for add(int, java.lang.String) -

c# - passing input text from view to contoller with FacebookContext using Facebook app -

Calling a C++ function from C# by passing a string with variable size to it -