Jquery 如何使html中的图像旋转木马在图片之间自行移动？

因此，目前我的图像旋转木马只有在用户移动时才会移动，但我希望它也能在图像之间自动流动。我目前的代码如下：

<!-- 1. Link to jQuery (1.8 or later), -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <!-- 33 KB -->

<!-- fotorama.css & fotorama.js. -->
<link  href="http://cdnjs.cloudflare.com/ajax/libs/fotorama/4.5.1/fotorama.css" rel="stylesheet"> <!-- 3 KB -->
<script src="http://cdnjs.cloudflare.com/ajax/libs/fotorama/4.5.1/fotorama.js"></script> <!-- 16 KB -->

<!-- 2. Add images to <div class="fotorama"></div>. -->
<div class="fotorama" id='carousel'>
  <img src="images/carousel1.jpg">
  <img src="images/carousel2.jpg">
  <img src="images/carousel3.jpg">
  <img src="images/carousel4.jpg">
</div>

---

有人能建议我应该添加什么来创建所需的功能吗？谢谢。

向

添加一个

数据自动播放=“true”

如下：

您只需使用开源twitter引导框架，该框架包含许多处理转盘的类。 因此，您必须下载bootstrap.min.css和carousel.css以及bootstrap.min.js和 jquery.min.js（最新版本）

这是一个例子：

<!-- Carousel
================================================== -->
<div id="myCarousel" class="carousel slide" data-ride="carousel">
  <!-- Indicators -->
  <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>
  <div class="carousel-inner">
    <div class="item active">

      <div class="container">
         <img src="images/header1.png" alt="First slide">
        <div class="carousel-caption">                
            <h1>Enjoy yourself in oursite</h1>
          <p><a class="btn btn-lg btn-primary" href="signup.html#inscription" role="button">Sign up today</a></p>
        </div>
      </div>
    </div>
    <div class="item">
      <div class="container">
          <img src="images/header2.png" alt="header2" >
        <div class="carousel-caption">
            <h1>See all our products in anytime you want </h1>            
          <p><a class="btn btn-lg btn-primary" href="menProducts.html#mi-slider" role="button">Browse gallery</a></p>
        </div>
      </div>
    </div>
    <div class="item">
      <div class="container">
          <img src="images/header3.png"/>
        <div class="carousel-caption">
          <h1>One more for good measure.</h1>             
          <p><a class="btn btn-lg btn-primary" href="#" role="button">Learn more</a></p>
        </div>
      </div>
    </div>
  </div>
  <a class="left carousel-control" href="#myCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
  <a class="right carousel-control" href="#myCarousel" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
</div><!-- /.carousel -->

在我们的网站上玩得开心

随时查看我们的所有产品

再来一杯。

非常简单的修复。不过有一个问题——有没有办法改变时间安排呢？下面是如何改变时间安排的