CSS and animate() in jquery

I'm trying to make navigation with some effects but my jquery code dosen't works like I expected. Actually I want to pass this css statement background: #ccc url('image.jpg') no-repeat; to animate function.

How to do that ?

<ul>
     <li><a href="#"></a></li>
     <li><a href="#"></a></li>
    </ul>

        $('ul li').hover(function() {    

            $(this).animate({
               'background' : '#ccc' 
            }, 'fast开发者_JAVA技巧');
        }
        });

jQuery cannot animate colors natively. You need a plugin like the jQueryUI.

http://jqueryui.com/demos/animate/

You need jQuery color plugin to animate colors.

Another option to go for is jQueryUI