Background color animation jQuery
<p>I'm pretty much stuck with a functionality that I want to add to a site with the <a href="http://www.bitstorm.org/jquery/color-animation/" rel="nofollow">Color Animation jQuery plugin</a>, what I'm trying to achieve is to switch the color of a certain div every 3s and each time user loads the page this color will be different too, load thing works fine but when it comes to animate it is where I have trouble, heres my code...</p>

<pre><code>var colors = ["#00b6ad", "#fdbc5f", "#d91b5c", "#f1592a", "#8dc63f"];                
var rand = Math.floor(Math.random()*colors.length); 
var random_color = colors[rand];          
$('#slider-area').css("background-color", random_color);
setInterval(function(){
   $('#slider-area').animate({backgroundColor: random_color} 500);}
, 3000); ​
</code></pre>

<p>I thought it could be related to passing variables in animate property because I have no trouble if I put myself a color at backgroundColor I've been googling around but I just can't make it work :S so any help will be appreciated :)</p>
