Question

几天前，我在http://www.billboard.com/上发现了一个非常有趣的幻灯片。我试着弄清楚如何重建它，但我很难失败。

这就是我已经完成的，我对jQuery的了解并不是很好。

这是一个Dropbox链接，适合所有人，他们希望获得我的代码的一些预览，以实现我的基本想法。 https://www.dropbox.com/s/pb19ydkkr7du2cl/slide.php

所以这取决于你们，希望你们可以给我一个“简单”的解决方案来解决我的问题（无限幻灯片和内容之间的间隔切换）。

Answer 1

我没有看你的代码，但从我的头脑中，我会说你需要像引导程序Carousel：http://twitter.github.io/bootstrap/javascript.html#carousel

它很容易设置。所有文档都在我已添加到此答案的链接中。为了基本，您将保留<ol>中的下一个和上一个图标，并将每个图片保存在一个带有item类的div中：

<div id="myCarousel" class="carousel slide">
  <ol class="carousel-indicators">
    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
    <li data-target="#myCarousel" data-slide-to="1"></li>
    <li data-target="#myCarousel" data-slide-to="2"></li>
  </ol>
  <!-- Carousel items -->
  <div class="carousel-inner">
    <div class="active item">…</div>
    <div class="item">…</div>
    <div class="item">…</div>
  </div>
  <!-- Carousel nav -->
  <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
  <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
</div>

水平方向无尽的幻灯片放映

1 个答案: