Tengo un menú que al bajar la página, éste continúa ahí y el color cambia de transparente a blanco, pero la letra deseo que cambie a negro.
Tengo en mi código JS que tome el identificador del div padre y cambie a todos sus hijos el color. Pues no me funciona, ya he intentado de varias formas y aun no he dado con el clavo.
Pongo mi código (también en JSFiddle):
window.onscroll = function() {
scrollFunction()
};
function scrollFunction() {
if (document.body.scrollTop > 80 || document.documentElement.scrollTop > 80) {
document.getElementById("navbar").style.height = "75px";
document.getElementById("navbar").style.backgroundColor = "#fff";
document.getElementById("navbar").style.color = "#000";
document.getElementById("navbar").style.line - height;
"37.5px";
} else {
document.getElementById("navbar").style.height = "100px";
document.getElementById("navbar").style.backgroundColor = "blue";
document.getElementById("navbar").style.color = "#000";
document.getElementById("navbar").style.line - height;
"50px";
}
}
a {
text-decoration: none;
list-style: none;
color: white;
}
#cabecera {
width: 100%;
height: 755px;
}
#navbar {
overflow: hidden;
background-color: blue;
transition: 0.4s;
position: fixed;
width: 100%;
height: 100px;
z-index: 99;
}
#navbar .container {
width: 90%;
height: 100%;
align-items: center;
display: flex;
left: 0;
right: 0;
}
#navbar #title {
display: inline-block;
line-height: inherit;
white-space: nowrap;
width: 30%;
}
#navbar .container .menu {
width: 70%;
margin-left: 50px;
display: inline-block;
line-height: inherit;
white-space: nowrap;
}
#navbar .container .menu>a {
width: 100%;
height: 100%;
padding-right: 50px;
}
<div id="cabecera" style="background-image: url(img/bg_3.jpg);background-size: cover;">
<div id="navbar">
<div class="container">
<a href="index.html" id="title"><b id="b">JORGE ACEVEDO </b></a>
<div class="menu">
<a href="#cabecera"><b id="b">Jorge Acevedo</b></a>
<a href="#cuerpo"><b id="b">Mis Propuestas</b></a>
<a href="#suscribe"><b id="b">Contacto</b></a>
</div>
</div>
</div>
</div>