在 Bootstrap 中滚动后更改导航栏中的徽标和字体

【问题标题】：Changing logo and font in navbar after scrolling in Bootstrap在 Bootstrap 中滚动后更改导航栏中的徽标和字体
【发布时间】：2016-06-17 18:42:40
【问题描述】：

我用jquery向下滚动后更改导航栏背景颜色，但我不知道如何在导航栏颜色更改时同时更改徽标（徽标颜色）和字体颜色...

代码如下： http://www.bootply.com/YIzwEneMF7

感谢建议

【问题讨论】：

标签： jquery css twitter-bootstrap-3 angular-ui-bootstrap navbar

【解决方案1】：

这是你的答案：http://www.bootply.com/jEfJnFXeR8

你的错误是这样的：.navbar-custom .scrolled { color: red;}

scrolled 类正在添加到 navbar-custom 而不是其中。

将以下代码添加到 css

.navbar-custom.scrolled .navbar-nav > li > a { color: red; }

【讨论】：

【解决方案2】：

在你的 jQuery if 语句中添加这个 CSS 代码，这会改变你的字体颜色，

if($(window).scrollTop() > startY){
    $('.navbar, .navbar-custom').addClass("scrolled");
  **$('.nav a').css('color','black');**
}
else{
    $('.navbar, .navbar-custom').removeClass("scrolled");
   **$('.nav a').css('color','white');**
}

【讨论】：