jquery - 为什么我的简单交叉淡入淡出不重复？

Question

我有一个简单的背景图像交叉推子：http: //jsfiddle.net/jRDkm/2/此代码的基础取自这里：http ://snook.ca/archives/javascript/simplest-jquery-slideshow

出于某种原因，尽管它只重复了一次，然后就变成了白色。如何调整我的代码以使其不断重复自己？

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);
};