jquery - ある色から別の色へのjQuery

Question

私はこのdivフィールドを持っています：

<div id="idNumber1" style="color: #ffcc00">hello</div>

そのため、画面に黄色のこんにちはが表示されます。

やりたいこと：黄色のハローを赤に変えてから、フェードアウトして黄色に戻したい。これどうやってするの？

答えてくれてありがとう。

Answer 1

他の人が指摘しているように、animate()関数自体は色を変更しません。ただし、CSS3 トランジションと組み合わせて、目的の効果を得ることができます。

#idNumber1 {
  color: #ffcc00;
  -webkit-transition: color 0.5s linear;
}

function flash(id) {
  $(id).css('color', '#ff0000');
  setTimeout(function() {
    $(id).css('color', '#ffcc00');
  }, 500);
}

次のように呼び出すと、500 ミリ秒かけて色が赤に変わり、500 ミリ秒かけて黄色に戻ります。

flash('#idNumber1');

もちろん、idNumber1は最も説明的ではないため、より良いものを検討したり、クラス名を使用してこの動作を持つ要素を示したりすることをお勧めします。また、完全なブラウザー プレフィックス トランジションのすべてまたは一部を含めることもできます。

-webkit-transition: color 1s linear;
-moz-transition: color 1s linear;
-o-transition: color 1s linear;
-ms-transition: color 1s linear;
transition: color 1s linear;

他にもたくさんの方法がありますが、ここではその 1 つを紹介します。