向下滚动时导航栏中的转换答案

【问题标题】：Transition in Navbar when Scroll Down向下滚动时导航栏中的转换
【发布时间】：2017-08-01 10:08:17
【问题描述】：

当我向下滚动时，我的导航栏颜色会发生变化。颜色在变化。但是没有过渡效果。如何为此进行过渡。这是我的代码..

$(window).scroll(function() {
if($(this).scrollTop() > 0)
{
    $('.navbar-trans').addClass('afterscroll');
} else
{
    $('.navbar-trans').removeClass('afterscroll');
}

});

这是我的脚本代码。而我的 CSS 是，

.navbar.navbar-trans.afterscroll { background-color:#1ba4df; }

如何为此添加动画。

【问题讨论】：

标签： javascript html css

【解决方案1】：

只需将此规则添加到您的 css 文件中即可。它会为你工作，因为这里 transition 属性设置为所有更改...

.navbar-trans {transition: all 0.3s ease; /* other css rules here */}

阅读更多关于转换属性here...

【讨论】：

欢迎梅尔宾..！很高兴它有帮助。 :)

【解决方案2】：

就是这样……试试这个家伙……

.navbar.navbar-trans.afterscroll { 
background-color:#1ba4df; 
Transition:0.3s all linear;
}

【讨论】：