Next Image not fading in. Previous images fade out and next one just appears

Question

I'm trying to make a background slider with next/prev button. Everything seems working until today. I did some changes today and some weird things happen.

Now next image won't fade in. Current image fade out to background color and then next image just appears. No effect. But the text on it seems to work. Current text fades out and next text fades in without any problem.

I reset it to yesterday’s condition. But the problem still persists.

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/

Answer 1

OK. Got it.

Added

position: fixed;

to image css ...