.delay() doesn' t work

$('.link').click(function(){
    $paneTarget.stop().scrollTo('#due', 800, { margin: true } ).toggleClass('sel开发者_开发百科ected'),
    $("body").delay(1000).animate({backgroundColor: "#1c6e7a"},800);   

});

The delay function doesn't work in the example. If I remove the .delay value the code works, but I need the background to change AFTER the other function has completed. Any suggestions?

I am assuming this is the .scrollTo() plugin. The plugin allows for a call back after the animation completes.

onAfter: A function to be called after the whole animation ended.

$('.link').click(function () {
    $paneTarget.stop().scrollTo('#due', 800, {
        margin: true,
        onAfter: function () {
            $("body").animate({
                backgroundColor: "#1c6e7a"
            }, 800);
        }
    }).toggleClass('selected');
});

Example on jsfiddle

I googled about it and i think that backgroundColor cant be animated for that you will need the jQuery plugin color:

http://plugins.jquery.com/project/color

Check the docs, you can specify a callback with onAfter