Question

如何向此幻灯片添加更多图像。当我添加4个以上的图像时，它会忽略第4个图像后的图像。当我添加新图像时，我需要更改什么。我想添加大约15张图片。或者我如何随机化图像的来源，使它们每次都不同。

HTML：灵魂的镜子当我们来到它时，让我们穿过那座桥寿司（做）时间拉屎梦醒时分

        <span id="timeline"></span>

        <ul class="dots_commands"><!--
            --><li><a title="Show slide 1" href="#sl_i1">Slide 1</a></li><!--
            --><li><a title="Show slide 2" href="#sl_i2">Slide 2</a></li><!--
            --><li><a title="Show slide 3" href="#sl_i3">Slide 3</a></li><!--
            --><li><a title="Show slide 4" href="#sl_i4">Slide 4</a></li>
        </ul>

    </section>
</body>
</html>

css是Long所以它在这个链接上：http://jsfiddle.net/3p4vu/

Answer 1

您必须更改幻灯片的命令是不必要的并且令人困惑。

您只需在当前图像选择器上使用$(...).prev()和$(...).next()即可。需要检查以检测您希望这种双端的结束或开始。

小提琴演示：http://jsfiddle.net/9fP59/ 你需要根据自己的喜好进行扩展和设计，但是有许多不同的下一个/上一个按钮是错误的。

使用更多框来演示此方法的可扩展性：http://jsfiddle.net/9fP59/2/

基于这个小提琴，您可以更改.prev()和.next()选择器以使用随机元素选择器处理相同的函数：

var random = Math.round(Math.random() * $('.image').length),
    element = $('.image').eq(random);

如何在HTML5 / CSS3幻灯片中添加更多图像

1 个答案: