Jquery背景幻灯片闪烁

Question

我有一个小脚本来创建一个css背景图片幻灯片。问题是图像周期性地闪烁，并且知道原因的押韵或原因。

/********************************
/* HERO UNIT BACKGROUND SLIDES
/*******************************/
$(document).ready(function() {
    var target = $('.hero-unit');
    var backgrounds = [
        'url(/static/template/slides/slide-2.jpg)', 
        'url(/static/template/slides/slide-3.jpg)',
        'url(/static/template/slides/slide-4.jpg)',
        'url(/static/template/slides/slide-5.jpg)',
        'url(/static/template/slides/slide-1.jpg)'
     ];
    var current = 0;

    function nextBackground() {
        target.css(
            'background-image',
        backgrounds[current = ++current % backgrounds.length]);

        setTimeout(nextBackground, 5000);
    }
    setTimeout(nextBackground, 5000);
        target.css({
            'background-image': backgrounds[0],
            WebkitTransition : 'background-image 3s ease-in-out',
            MozTransition    : 'background-image 3s ease-in-out',
            MsTransition     : 'background-image 3s ease-in-out',
            OTransition      : 'background-image 3s ease-in-out',
            transition       : 'background-image 3s ease-in-out'
        });
});