Следующее изображение не появляется. Предыдущее изображение исчезает, а следующее появляется

Я пытаюсь сделать фоновый слайдер с кнопкой "следующий/предыдущий". Вроде все работает до сегодняшнего дня. Я сделал некоторые изменения сегодня, и некоторые странные вещи происходят.

Теперь следующее изображение не будет появляться. Текущее изображение исчезает до цвета фона, а затем просто появляется следующее изображение. Нет эффекта. Но текст на нем вроде работает. Текущий текст исчезает, а следующий текст появляется без проблем.

Сбрасываю до вчерашнего состояния. Но проблема все еще сохраняется.

JS:

    $(function () {
    var count = $("#slider > spanslide").length;
    var slider = 1;
    var speed=7000;
    var fadeSpeed = 1500;
    var loop ;
    start();
    $("#1").fadeIn(fadeSpeed);
    $('.right').click(right);
    $('.left').click(left);
    function start(){
        loop = setInterval(next, speed);
    }
    function right() {
        $("spanslide").stop(1,0);
        next();
        clearInterval(loop);
        start();
        return false;
    }
    function left() {
        $("spanslide").stop(1,0);
        prev();
        clearInterval(loop);
        start();
        return false;
    }
    function prev() {
        slider--;
        if (slider < 1) {
            slider = count;
        }
        $("#slider > spanslide").fadeOut(fadeSpeed);
        $("#" + slider).fadeIn(fadeSpeed);
    }
    function next() {
        slider++;
        if (slider > count) {
            slider = 1;
        }
        $("#slider > spanslide").fadeOut(fadeSpeed);
        $("#slider > #" + slider).fadeIn(fadeSpeed);
    }
    }
    );

JSFIDDLE: http://jsfiddle.net/nt8ew1h9/2/