好吧，我一直在尝试寻找答案并测试了几个小时，但没有成功。我在这里或通过我自己的尝试和错误找不到正确的答案，所以如果这是重复的，请原谅我。这是我需要帮助的内容：当我滚动到页面的其他部分时，我试图更改导航文本颜色。因此，如果我滚动到 #firstpane id/div，导航栏中的“关于”文本将是黑色的。当 #secondpane id/div 在导航栏上滚动时，“技能”文本将为黑色。当滚动到 #thirdpane id/div 时，导航栏中的文本“联系人”将变成黑色。这就是我在这里想要完成的事情。
有谁知道如何使用纯 css 或 javascript（不使用 jQuery）来解决这个问题？我知道如何在 jQuery 中执行此操作，但在本例中无法使用它，所以请不要建议使用 jQuery 进行指导。
谢谢。
body {
background-image: url("images/someTree.jpg");
background-size: cover;
font-family: 'Roboto', sans-serif;
margin: 0;
}
header {
width: 100%;
height: 85px;
position: fixed;
overflow: hidden;
top: 0;
left: 0;
z-index: 1000;
background-color: #96C339;
}
header h1#logo {
display: inline-block;
float: left;
font-family: "Monsterrat", sans-serif;
font-size: 40px;
color: #FFF;
font-weight: 400;
margin-left: 35px;
}
header nav {
display: inline-block;
float: right;
}
header nav a …