要素の色をある色から別の色にアニメーション化する方法はありますか？

Question

私は自分のウェブサイトを作ろうとしているので、jQueryアニメーションを使って段落をフェードインまたはフェードアウトする必要があります。このため、jQuery UIを取得しましたが、テストエレメントの色をアニメーション化しようとしていますが、動作しないようです。 divの初期色は、半透明で明るい灰色の色（rgba（191,191,191,0.25））で、完全に不透明な黒（＃000000）にアニメーション化しようとしています。私の文法は正しいと私はほとんど確信していますが、文書のヘッダにすべてが正しい順序で含まれているかどうかはわかりません。ここで助けてもらえますか？ここに含まれるスクリプトとスタイルシートのコードがあります：

$(".click-leftmenu").mouseup(function() { 
    if ($(this).attr("out") == 0) { 
     $(this).animate({width: "4em", height: "4em"}, 100); 
     $(this).prev().animate({height: "4em"}, 100); 
     $(".click-leftmenu[out=1]").prev().animate({width: "0%", height: "0%"}); 
     $(".click-leftmenu").attr("out", 0); 
     $(this).prev().animate({width: "50%"}, 500); 
     $(this).prev().animate({height: "40em"}); 
     $(this).prev().animate({color: "#000000"}); 
     $(this).attr("out", 1); 
    } 
}); 

完全なコードを見つけることができます：

<link rel="stylesheet" type="text/css" href="mainpagestyle.css"> 

<script src="scripts/jquery-2.2.3.min.js"></script> 

<link rel="stylesheet" type="text/css" href="jquery-ui.min.css"> 
<script src="scripts/jquery-ui-1.11.4.custom/external/jquery/jquery.js"></script> 
<script src="scripts/jquery-ui-1.11.4.custom/jquery-ui.js"></script> 

<script src="scripts/mainscript.js"></script> 

ここでのコード「mainscript.js、」場合には、それはスクリプトの構文とは何だのですここに：

HTML

jQuery

Answer 1

これを使用して背景色をアニメーション化します。私は他の要素が何のために使われているのかわからないし、私たちはHTMLを持っていないので残りを除外している。

$(document).on("click", ".click-leftmenu", function() { 
    $(this).animate({ 
    backgroundColor: "#000000" 
    }, 1500); 
});