Minimal Content Slider Carousel Plugin For jQuery

Simple Carousel is a minimal jQuery slider plugin which allows to slide through a set of html content with a smooth sliding effect based on CSS3 transitions and transforms.

How to use it:

1. Add references to jQuery library and the jQuery simple carousel plugin to your webpages.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="simple-carousel.js"></script>

2. Add your custom html content to the carousel.

<div id="carousel-demo">
  <div>
    <div class="wrapper">
      <h2>Slide 1</h2>
    </div>
  </div>
  <div>
    <div class="wrapper">
      <h2>Slide 2</h2>
    </div>
  </div>
  <div>
    <div class="wrapper">
      <h2>Slide 3</h2>
    </div>
  </div>
  <div>
    <div class="wrapper">
      <h2>Slide 4</h2>
    </div>
  </div>
  <div>
    <div class="wrapper">
      <h2>Slide 5</h2>
    </div>
  </div>
</div>

3. Initialize the plugin to generate a basic carousel.

$(document).ready(function() {
  c = new Carousel('#carousel-demo');
});

4. Make the carousel 'Autoplay' on page load.

c.auto_next(3000);

5. Add your own controls to the carousel using the following methods.

// goto next slide
c.next()

// back to previous slide
c.previous()

// move to slide n
c.move_to(0)

// stop autoplay
c.stop_auto();

---

This awesome jQuery plugin is developed by Matthew0x40. For more Advanced Usages, please check the demo page or visit the official website.