向下滚动时在导航栏中过渡

Question

向下滚动时，我的导航栏颜色会发生变化。颜色在变化。但是没有过渡效应。如何给这个过渡。这里是我的代码..

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

}）;

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

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

如何给这个动画。

Answer 1

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

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

了解更多关于过渡性质here...

Answer 2

完蛋了......试试这个家伙....

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