Плавное изменение бэкграунда блока

На странице есть слайдер, в котором крутится несколько картинок. В слайдере определяется текущая картинка, из нее берется data-параметр и подставляется в качестве бэкграунда для блока.

slideItems.removeClass('current');
slideItems.eq(currentSlide).addClass('current');
var current_image_src = $('.carousel .slideItem.current img').data('bg-image-src');
$('.conteiner').css('background-image', 'url(http:' + current_image_src + ')');

Но при таком варианте картинка меняется резко.
Как можно сделать так, чтобы картинка менялась плавно с использованием animate()?