jQuery + RGBA彩色动画

Question

有谁知道jQuery是否可以处理如下动画:

rgba(0,0,0,0.2) ? rgba(0,255,0,0.4)

我知道有一个插件可以处理彩色动画,但这可能太现代了？

Answer 1

使用CSS3动画(没有javascript)

您还可以使用CSS3动画实现相同的效果.见下文,

第1步:为动画创建关键帧

@keyframes color_up {
    from {
        background-color: rgba(0,0,0,0.2);
    }
    to {
        background-color: rgba(0,255,0,0.4);
    }
}

第2步:使用动画规则.

  animation-name: color_up;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-timing-function: ease-in-out;

演示: http ://jsfiddle.net/2Dbrj/3/

使用jQuery

jQuery的现在支持彩色动画与RGBA支持.这实际上是从一种颜色到另一种颜色的动画.

$(selector).animate({
  backgroundColor: 'rgba(0,255,0,0.4)'
});

演示:http://jsfiddle.net/2Dbrj/2/

Answer 2

呃,没关系.找到了对jquery颜色插件的惊人修改.

http://pioupioum.fr/sandbox/jquery-color/