Karolis Beliašas Karolis Beliašas - 1 year ago 60
CSS Question

After javascript addclass it adds class but css property not working

Can please someone help me? My web page is: http://etinklapis.lt/

Here .header-line after scroll has an additional class of .header-line .active but css can't see it and doesn't change the background-color. You can see my css and there .header-line .active is with background-color property. Why is my background still transparent?


.header-line {
width: 100%;
height: 60px;
background-color: rgba(255,255,255,0.00);
.header-line .active {
background-color: white;


<div class="header-line">header</div>


$(function() {
$(window).on("scroll", function() {
if($(window).scrollTop() > 50) {
} else {
//remove the background property so it comes transparent again (defined in your css)

Answer Source

That is because in your css file you have .header-line .active { ... }, and that means .active class inside .header-line class.

You should change that to .headerline.active { ... } (remove the space)

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download