Javascript Jquery淡出法

首先，我是一个完全的初学者

我希望颜色块在切换前淡出。这是一个密码和我目前的密码

$('#6').css({'background-color': '#FFFF00'});

setTimeout(function(){
    $('#11').css({'background-color': '#008000'}).siblings().css({'background-color': '#2e2e2e'});
}, 500);

setTimeout(function(){
    $('#9').css({'background-color': '#0000CD'}).siblings().css({'background-color': '#2e2e2e'});
}, 1000);

setTimeout(function(){
    $('#4').css({'background-color' : '#FFFFFF' }).siblings().css({'background-color' : '#2e2e2e'});}, 1500);

setTimeout(function(){
    $('#14').css({'background-color' : '#FF8C00'}).siblings().css({'background-color' : '#2e2e2e'});}, 2000);

---

我希望色块在切换前淡出，但我不知道如何操作。如果有人能帮忙，我将不胜感激。

试着用一下这把小提琴

---

要设置颜色动画，您可以使用颜色，或者只使用

removeClass

addClass或

toggleClass

切换类，并使用css3设置颜色动画。

$（'#6'）.fadeOut（）.css（{'background-color'：'#ffff'）.fadeIn（）它应该可以工作，但我不确定它是否符合您的想法。淡出功能还具有回调功能，因此您可以使用它来代替
setTimeout
非常感谢您的回复，Maciej！它起作用了！你能告诉我在我的情况下如何使用回调函数吗。谢谢谁能告诉我为什么被否决？这不是最好的问题，但每个人都可以是初学者@user3125295添加了代码和JSFIDLE，这在很多情况下是不常见的。我添加了我的解决方案作为答案，并对其进行了一点升级，所以如果您认为这是正确的答案，请随意接受
$('#6').fadeOut(500,function(){

$(this)
.css({'background-color':'#FFFF00'})
.fadeIn(500);
$(this)
.siblings()
.css({'background-color': '#2e2e2e'})});