javascript - 了解如何使用 jQuery 插件 RhinoSlider

Question

我正在尝试使用 http://rhinoslider.com/ 中的 RhinoSlider但是文档很难告诉您如何使用它。它向您展示了如何调用它，但没有展示如何为它构建您的内容。

在下载的演示中它使用了这个..

    <div id="page">
        <ul id="slider">
            <li><img src="img/slider/01.jpg" alt="" /></li>
            <li><img src="img/slider/02.jpg" alt="" /></li>
            <li><img src="img/slider/03.jpg" alt="" /></li>
            <li><img src="img/slider/04.jpg" alt="" /></li>
            <li><img src="img/slider/05.jpg" alt="" /></li>
        </ul>
    </div>

这并不能说明什么，我必须使用类似的格式吗？ page ID 有什么特别之处吗？我必须使用列表吗？

我的代码如下..

<div id="slide1" class="slide">
    // Lots of content
</div>
<!-- Slide 1 Ends -->
<div id="slide2" class="slide">
    // Lots of content
</div>
<!-- Slide 2 Ends -->

每张幻灯片(幻灯片 1、2 等)都有一个背景图像作为主图像；然后它里面的内容是带有文本和/或其他图像的 div。

如何让它与我的内容一起使用？

Answer 1

您可以使用任何您想要的标记。唯一的限制是，您必须有一个父(包装)元素。

所以你可以使用这个:

<div id="slider">
    <div>slide 1</div>
    <div>slide 2</div>
</div>

或者更语义化的版本:

<ul id="slider">
    <li>slide 1</li>
    <li>slide 2</li>
</ul>