couleur jQuery animation

Question

Je suis coincé avec une fonction qui ne veut pas animer ...

J'utilise la dernière jQuery Color Plugin pour permettre des animations de couleurs. Maintenant, ce qui devrait arriver dans le code suivant est que (quand cela fonctionne bien sûr):

(1) l'utilisateur sélectionne une couleur, (2) basé sur la valeur RVB de cette couleur, nous créons une nuance plus claire de cette couleur, (3) lors du survol d'un lien, sa couleur est remplacée par la couleur nouvellement calculée, (4) lors du déplacement en dehors du lien, la couleur d'origine devrait être animé.

les travaux de remplacement des couleurs absolument très bien, mais l'animation ne ressemble pas à un effet de survol CSS traditionnel mais à un effet effectué sur 800msecs avec jQuery. Si le Ninja est là pour m'aider, je serais plus que prêt à briller vos étoiles de lancer pendant une semaine :). Voici le code:

$('a').hover(function() { 
//code when hover over 
$oldColour = $(this).css('color'); 

    $(this).animate({'color': $(this).css('color', function(i, v){ 
     var rgb = getRGB($(this).css('color')); 

     for(var i = 0; i < rgb.length; i++){ 
     rgb[i] = (rgb[i] + 60 < 255) ? rgb[i] + 60 : 255; 
     } 

     var newColor = 'rgb(' + rgb[0] + ',' + rgb[1] + ',' + rgb[2] + ')'; 
     return newColor; 

     }) //end anonymous function 
    }, 800); //end animate 


    }, function() { 
     //code when hovering away 
     $(this).animate({'color': $(this).css('color', $oldColour)}, 800); 
    }); 

Votre aide, comme toujours, est génial et grandement apprécié! Merci yous (et les filles, bien sûr) pour jeter un oeil :)

PS Pour voir un exemple en direct, aller à demo page et survolez un lien ...

MISE À JOUR =====: Et plus Besoin d'aide ===== Le code de Cambraca fonctionne parfaitement. Sauf que dans IE il passe d'abord à une couleur très sombre, puis retourne à la couleur initiale lorsque je souris, puis quand je survole à nouveau, la couleur recalculée correcte affiche ...

Des idées sur la façon de résoudre cela pour IE?

Answer 1

Essayez cette

var $oldColour; 

$('a').hover(function() { 
    //code when hover over 
    $oldColour = $(this).css('color'); 
    var rgb = getRGB($(this).css('color')); 
    for (var i = 0; i < rgb.length; i++) 
     rgb[i] = Math.min(rgb[i] + 60, 255); 
    var newColor = 'rgb(' + rgb[0] + ',' + rgb[1] + ',' + rgb[2] + ')'; 
    $(this).animate({'color': newColor}, 800); 
}, function() { 
    //code when hovering away 
    $(this).animate({'color': $oldColour}, 800); 
});