JavaScript标题背景淡出

Question

我正在尝试使用非常简单的if语句将一个背景图像淡入另一个背景图像。目前我的背景图像不会逐渐消失，它们首先淡入白色背景，然后另一个图像消失后，我会喜欢它们直接淡入彼此。其次，我的图像显示出现错误，所以当在if语句中达到数组（1）的限制时，它会将一个简单的currentBackground变量设置为0，这意味着背景应该从数组中的0开始但是，这不会发生，有时图像相同的图像会重复显示。

            $(window).load(function() {
        var images = ['img/fitness-bg-2.jpg','img/runner-header.jpg'];
        var i = 0;

        function changeBackground() {
            $('#header').fadeOut(250, function(){
                $('#header').css('background-image', function () {
                    if (i >= images.length) {
                        i = 0;
                    }

                    return 'url(' + images[i++] + ')';
                });
                $('#header').fadeIn(500);
            })
        }
        changeBackground();
        setInterval(changeBackground, 5000);
    });