jQuery: animate text color

Question

i wanna dynamically change the link color within a hover event. I got the following code so far but it doesn´t work. Any suggestions why? In my oppinion it seems to be right...

    $('.fadelink').hover(function(){            
        $(this).animate({
            color: '#333'
        }, 600);            
    },
    function(){
        $(this).animate({
            color: '#999'
        }, 600);          
    });

if you dont want to go too complicated, simply fade the element out, change the colour and fade it back in. simplest option. — cillierscharl, Sep 22 '11 at 14:28
possible duplicate of [jQuery: animate text color for input field?](http://stackoverflow.com/questions/1354277/jquery-animate-text-color-for-input-field) — Naftali, Sep 22 '11 at 14:29

score 9 · Accepted Answer · edited Sep 22 '11 at 14:29

9

You have to add colors plugin to make it work. That is stripped from core.

edited Sep 22 '11 at 14:29

Dennis

32,200
11
64
79

answered Sep 22 '11 at 14:27

Arda

6,756
3
47
67

Yup, forgot about the color plugin. My mistake. – Brad Christie Sep 22 '11 at 14:29

score 4 · Answer 2 · answered Sep 22 '11 at 14:30

jQuery doesn't support animation of colors, but it can with the color plugin: http://plugins.jquery.com/project/color

However, there's another route you could take, with CSS3, if you don't mind it not working in some older browsers:

.baseClass {
    color:#999; 

    -webkit-transition-property:color; 
    -webkit-transition-duration: 1s, 1s; 
    -webkit-transition-timing-function: linear, ease-in;
}

.baseClass:hover {
    color: #333;
}

score 0 · Answer 3 · edited May 23 '17 at 12:02

0

See the answer to this question: jQuery: animate text color for input field?

You cannot animate css text color with jQuery.

edited May 23 '17 at 12:02

Community

1
1

answered Sep 22 '11 at 14:29

Naftali

144,921
39
244
303

Muhammad Usman · Answer 4 · 2011-09-22T14:35:12.833

0

You have to use jQuery color plugin to make color animation work.

edited Sep 22 '11 at 14:35

answered Sep 22 '11 at 14:29

Muhammad Usman

12,439
6
36
59

jQuery: animate text color

4 Answers4

Linked