向下滾動時在導航欄中過渡

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; 
 
}