jquery - jqueryでテキストの色を変更する（ノンストップ点滅）

Question

jqueryを使用してテキストを2つの色/クラス間で継続的に切り替える最も簡単な方法は何ですか？

Answer 1

簡単な例：

CSS

div { color: red; }
div.blinking { color: blue; }

jQuery（DOMreadyイベント時）

var el = $('div');
setInterval(function() {
   el.toggleClass('blinking');
}, 1000);

フィドルの例：http：//jsfiddle.net/gLEuP/

---

それ以外の場合は、最新のブラウザでJSをまったく回避し、CSS3アニメーションのみを使用できます。

@keyframes blink {
    0% { color  : red; }
    49% { color : red; }
    50% { color : blue }
    100% { color: blue; }
}

div {
    animation: blink 2s linear infinite;
}

コードペンの例（ベンダープレフィックス付き）：http ：//codepen.io/anon/pen/NPJBbe

遅すぎる遅延を設定することは避けてください。光過敏性てんかんの影響を受けた人を傷つける可能性があります（そして他のすべての人に迷惑をかける可能性があります）

Answer 2

jqueryのrotatecolorでの簡単なグーグル検索はこれをもたらします

http://buildinternet.com/2009/09/its-a-rainbow-color-changing-text-and-backgrounds/

点滅効果の場合、jqueryを使用してクラスを切り替えるsetIntervalを使用して、常に1秒または0.5秒ごとに関数を実行できます。

Answer 3

試す

function switch() {

   $("p").toggleClass("comic-sans");

}

setInterval("switch()", 1000);

Answer 4

色を変数として受け入れる関数を作成します。関数では、渡された色に基づいて、次に使用する色を決定します。テキストの色を変更しますelement.style.color = '#FF0000';。まだ関数内setTimeout()で、「新しい」色で関数を呼び出して渡します。次に、$(document).ready色変更関数を呼び出します。

Answer 5

私はこれを思いつきました：

//Click the Fade out button
$("#fadeOut").click(function(){
    fadeItOut();
});

var fadeItOut = function() {
  $("p").fadeOut("slow", function(){
      fadeItIn();
  });
};

var fadeItIn = function() {
    $("p").fadeIn("fast", fadeItOut());
};