Анимировать изменение фонового изображения с помощью jQuery

Наконец-то у меня теперь это работает, но я хотел бы знать, как я могу использовать функцию анимации JQuery, чтобы изменения фона изображения плавно исчезали, когда вы наводите курсор мыши на элементы списка на главной странице: -

http://www.thebalancedbody.ca/

Кодекс, чтобы сделать это до сих пор:

$("ul#frontpage li#277 a").hover(
    function() {
        $('#homepage_container').css('background-image', 'url(http://www.thebalancedbody.ca/wp-content/themes/balancedbody_V1/images/nutrition_background.jpg)');
    },
    function() {
        $('#homepage_container').css('background-image', 'url(http://www.thebalancedbody.ca/wp-content/themes/balancedbody_V1/images/default_background.jpg)');
    }
);

$("ul#frontpage li#297 a").hover(
    function() {
        $('#homepage_container').css('background-image', 'url(http://www.thebalancedbody.ca/wp-content/themes/balancedbody_V1/images/vibration_training.jpg)');
    },
    function() {
        $('#homepage_container').css('background-image', 'url(http://www.thebalancedbody.ca/wp-content/themes/balancedbody_V1/images/default_background.jpg)');
    }
);

и т. д.

Как бы я добавил к этому функцию ANIMATE - спасибо !!!

Спасибо

Джонатан

Ответы на вопрос(9)

Ваш ответ на вопрос