javascript - 如何使用 fadeIn() 过渡到最后一张幻灯片

Question

我制作了一个脚本来创建这个“幻灯片”:http://jsfiddle.net/LWBJG/2/

如果我在第一张幻灯片上点击“上一张”，我将无法返回到最后一张幻灯片

我尝试使用 last-child 选择器但没有成功

我也试过像这样直接重置计数:

 if(count==1){    
    count=2;
    $(".slideshow :nth-child("+count+")").fadeIn(); 
}

我已经坚持了两天了，我试图了解我做错了什么!

如果我“站在”第一张幻灯片上时点击“上一张”，我剩下要做的就是转到最后一张幻灯片

Answer 1

首先，您需要隐藏页面首次加载时未显示的所有其他 .slideshow img 元素。您可以通过多种方式做到这一点，但这里有一个例子:

$(".slideshow img:not(:nth-child(" + count + "))").hide();

接下来，您需要在转到上一张幻灯片时隐藏当前显示的幻灯片:

$(".slideshow :nth-child(" + count + ")").fadeOut();

最后，当转到最后一张图片时，您需要将计数设置为 .slideshow img 中的元素数:

count = $(".slideshow img").length;

这是一个工作示例:http://jsfiddle.net/LWBJG/22/