jquery - 如何使用播放和暂停按钮制作自动幻灯片放映？

Question

在我的应用程序中，我想要一个带有播放和暂停按钮的自动幻灯片放映。

Answer 1

• 请参阅此示例http://www.slidesjs.com/examples/playing/
• 使用这个 JS 库http://www.slidesjs.com/

这样做

<div class="container">
    <div id="slides">
      <img src="img/example-slide-1.jpg">
      <img src="img/example-slide-2.jpg">
      <img src="img/example-slide-3.jpg">
      <img src="img/example-slide-4.jpg"">
    </div>
</div>


<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://www.slidesjs.com/examples/playing/js/jquery.slides.min.js"></script>
  <script>
    $(function() {
      $('#slides').slidesjs({
        width: 940,
        height: 528,
        play: {
          active: true,
          auto: true,
          interval: 4000,
          swap: true,
          pauseOnHover: true,
          restartDelay: 2500
        }
      });
    });
  </script>