jquery - 使用 jquery 使文本更改颜色（不停闪烁）

Question

使用 jquery在两种颜色/类之间连续切换文本的最简单方法是什么？

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;
}

示例 codepen（带有供应商前缀）：http ://codepen.io/anon/pen/NPJBbe

注意，避免设置太小的延迟，它可能会伤害受光敏性癫痫影响的人（并且让其他人烦恼）

Answer 2

对 jquery 旋转颜色的简单谷歌搜索带来了这个

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

对于闪烁效果，您始终可以使用 setInterval 每隔一秒或半秒运行一个函数，这将使用 jquery 切换一个类

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());
};