Well, I've been reading about Interface yesterday but I think it's too confusing for me and I have no clue how to use the animate() method and than, how would I choose 2 colors to fade from and to? I have no idea how to do that...
However, I found this jQuery plugin: http://www.mathias-bank.de/jQuery/jquery.colorGradient.js Which doesn't do exactly what I want, but has a set of methods implemented to calculate color gradients and returning it in an array, I just need to implement methods to change the color using that array. Here's my noob try. The following code was added to the plugin above: sleep: function(timeout) { var loop = true; var current = new Date(); var now; var cTimestamp = current.getTime(); while(loop) { now = new Date(); nTimestamp = now.getTime(); if(nTimestamp - cTimestamp > timeout) { loop = false; } } } fadeColor: function(startColor, endColor, type, cssTag, step) { var color = jQuery.calculateColor(startColor, endColor, {"count": step, "type":type}); for (var i = 0; i < step; i++) { $(this).css(cssTag, color[i]); jQuery.sleep(1000); } } Than, I have this code on the readyevent: $('div#content a').each(function() { $(this).mouseover(function() { $(this).fadeColor('#ff0000', '#00ff00', [1,1,1], "color", 3); }); }); So, as you see the step is 3, which means, it will take one second to change from the first color to the second and another second to change from the second color to the third. However, with this code, it will take 3 seconds to change from the first color to the last, it won't show the first color nor the second. It will go straight to the last color. I know I'm doing something wrong cause I'm really a newbie at jQuery/JavaScript. I believe this plugin is enough for what I want to do, I just need to know how to adapt it to my needs. I didn't want to use Interface, unless I really need to, cause it's a bit confusing with all it's plugins and such. For now, it would be great if someone could help me out use tis colorGradient plugin to adapt it to my needs.