javascript 如何使文本在悬停时慢慢改变颜色?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16683143/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make text slowly change color on hover?
提问by user9124
I want to make my text change color slowly like this: http://trentwalton.com/2011/05/10/fit-to-scale/
我想让我的文字像这样慢慢改变颜色:http: //trentwalton.com/2011/05/10/fit-to-scale/
Any Ideas?
有任何想法吗?
回答by
You can do it with CSS Transitions:
你可以用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;
}
回答by Anujith
Use CSS Transitions.. See this: Fiddle
使用 CSS Transitions.. 看这个: 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;
}
回答by ShibinRagh
Try
尝试
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;
}
回答by Janak
As said by @elclanrs or you can also use this.
正如@elclanrs 所说,或者你也可以使用它。
$("selector").hover(function(){
// your code to fade in or fade out ....
});