javascript - 別の背景色にアニメーション化してから、もう一度元に戻す

Question

白い背景を緑色に点滅させようとしています。現在、私はそれを緑に変えるこのコードを持っています：

$( "#modal_newmessage" ).animate({
    backgroundColor: "#8bed7e"
}, 500 );

しかし、同じアニメーションで再び白くする方法がわかりません。どうすればよいですか？

Answer 1

.animate()アニメーションはキューに入れられるため、別の呼び出しを連鎖させることができfxます。

$("#modal_newmessage").animate({
  backgroundColor: "#8bed7e"
}, 500).animate({
  backgroundColor: "#fff"
}, 500);

ほとんどのjQuery関数は、$("#modal_newmessage")2回呼び出す必要なしにチェーン可能であることを忘れないでください。

こちらをご覧ください。

Answer 2

これは機能するはずです：

$( "#modal_newmessage" ).animate({
    backgroundColor: "#8bed7e"
}, 500, function() {
    $( "#modal_newmessage" ).animate({ backgroundColor: "#fff" });
} );

Answer 3

これを試して：

$(function() {

    $( "#modal_newmessage" ).animate({
      backgroundColor: "#aa0000",
      color: "#fff",
      width: 500
    }, 1000 ).animate({
      backgroundColor: "#fff",
      color: "#000",
      width: 240
    }, 1000 );
});

ノート：

jQuery ui背景色をアニメーション化するには、カラーアニメーションが必要です。

<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>