jquery - 単純なクロスフェードが繰り返されないのはなぜですか？

Question

シンプルな背景画像のクロスフェーダーがあります：http：//jsfiddle.net/jRDkm/2/このコードの基礎はここから取得されました：http ：//snook.ca/archives/javascript/simplest-jquery-slideshow

なんらかの理由で、1回の繰り返しだけで、その後白にフェードします。コードを微調整して、常に繰り返されるようにするにはどうすればよいですか？

JS：

function slideshow() {
$('#fullscreen-slider li:gt(0)').hide();
setInterval(function(){
    $('#fullscreen-slider :first-child').fadeOut()
    .next('li').fadeIn()
    .end().appendTo('#fullscreen-slider');
}, 3000);
};

Answer 1

セレクターが間違っています。試す

$('#fullscreen-slider li:first').fadeOut()
        .next('li').fadeIn()
        .end().appendTo('#fullscreen-slider');

デモ：http：//jsfiddle.net/jRDkm/5/

Answer 2

LIVE DEMO

/* located within plugins.js */
function fitElements() {
    $('ul#fullscreen-slider li').height( $(window).height() ).width( $(window).width() );
}

function slideshow() {
    var n = 0;
    var $LI =  $('#fullscreen-slider li');
    $LI.hide().eq(n).show();
    setInterval(function(){
        $LI.eq(n++%$LI.length).fadeTo(600,1).siblings().fadeTo(600,0);
    }, 3000);
}

$(document).ready(function() {
    fitElements();
    slideshow();
});

Answer 3

これを試してください：http： //jsfiddle.net/jRDkm/4/

function slideshow() {
    $('#fullscreen-slider li:gt(0)').hide();
    setInterval(function(){
        $('#fullscreen-slider li:eq(0)').fadeOut()
        .next('li').fadeIn()
        .end().appendTo('#fullscreen-slider');
    }, 3000);
};