如何让文字在悬停时慢慢改变颜色?

时间:2013-05-22 03:47:38

标签: javascript css css-transitions

我想让我的文字像这样慢慢地改变颜色: http://trentwalton.com/2011/05/10/fit-to-scale/

任何想法?

4 个答案:

答案 0 :(得分:14)

Working FIDDLE Demo

您可以使用CSS Transitions

执行此操作
a {
    color: lime;
    -webkit-transition: color 1s;
    -moz-transition:    color 1s;
    -ms-transition:     color 1s;
    -o-transition:      color 1s;
    transition:         color 1s;
}

a:hover {
    color: red;
}

答案 1 :(得分:1)

使用CSS过渡.. 请参阅:Fiddle

a {
  color: #000000;
}
a:hover {
   color: #E24B3B;
}
ul a {
 -webkit-transition: color 0.2s ease-out;
 -moz-transition: color 0.2s ease-out;
 -o-transition: color 0.2s ease-out;
 -ms-transition: color 0.2s ease-out;
 transition: color 0.2s ease-out;
 }

答案 2 :(得分:0)

正如@elclanrs所说,或者你也可以使用它。

$("selector").hover(function(){
    // your code to fade in or fade out ....
});

答案 3 :(得分:0)

尝试

a {
  color: red;

-webkit-transition: color 0.2s ease-out;
 -moz-transition: color 0.2s ease-out;
 -o-transition: color 0.2s ease-out;
 -ms-transition: color 0.2s ease-out;
 transition: color 0.2s ease-out;
}
a:hover {
   color: blue;
}