jquery-renewal: A carousel for jQuery

I made a jQuery Carousel.

It’s called jquery-renewal.

About midway through the 45 Best jQuery Carousel Roundup is when the madness sets in. There are a lot of jQuery carousels.

So I made another, but I made sure mine had a Logan’s Run reference.

Why on earth would I make my own jQuery carousel? The goals of this project, from the README:

  1. Good test coverage. Because we’re all professionals here. Specs are written with Jasmine and Jamine-jQuery.
  2. Few opinions. Most carousel plugins do a lot of mucking about on element styles that I think you should handle on your own.
  3. It doesn’t have to be a list. Any element with children can effectively become a carousel.
  4. Have an API. That’s really important.

There are lots of things that jquery-renewal does not do.

Other carousel plugins set up next and previous buttons for you and maybe even position indicators. jquery-renewal does not do this, you should do this.

jquery-renewal provides enough to make just the kind of carousel you want. It tries to be as lightweight as possible, providing a very simple API for moving through the elements. You want buttons? Make ‘em yourself and trigger the events (or call methods directly on the API). You want indicators? With methods like size() and getPosition() you should be able to make your own indicators. You want an auto-rotating carousel? Here’s a function for you:

function rotate(delay) {
  // if the current position is not the end of the carousel
  if (myCarousel.getPosition() !== myCarousel.size() - 1) {
    return setTimeout(function () {
      myCarousel.advance();
      rotate(delay);
    }, delay);
  }
}

Check out the project, fork it, and see if there’s anything I missed. Contributions are welcome!

  1. mwunsch posted this