jquery - jQuery 从一种颜色到另一种颜色

Question

我有这个 div 字段：

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

所以，我们在屏幕上看到黄色的你好。

我想要做什么：我想让黄色的 hello 变成红色，然后淡出回到黄色。我怎样才能做到这一点？

谢谢你的回答。

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;

有很多其他方法可以做到这一点，这里只是一种。