Slick carousel for web projects

Slick carousel – the last carousel you’ll ever need.

Slick carousel in action

Implement slick carousel in your project with no pain. To start working with Slick right away, there’s a couple of CDN choices availabile to serve the files as close, and fast as possible. Lazy load images included. And rich settings – more information here.

Setup

npm install slick-carousel

In slick 1.5 you can now add settings using the data-slick attribute. You still need to call $(element).slick() to initialize slick on the element.

Example

<div data-slick='{"slidesToShow": 4, "slidesToScroll": 4}'>
  <div><h3>1</h3></div>
  <div><h3>2</h3></div>
  <div><h3>3</h3></div>
  <div><h3>4</h3></div>
  <div><h3>5</h3></div>
  <div><h3>6</h3></div>
</div>

License: MIT

Homepage

http://kenwheeler.github.io/slick/

GitHub

https://github.com/kenwheeler/slick

See also

Responsive ReactJS carousel gallery: react-image-gallery

jQuery circular carousel plugin

Flip Carousel – a jQuery and CSS3 carousel plugin with flipping effects

jQuery Carousel-3D plugin – a cross browser 3D Carousel

Touch-friendly jQuery carousel plugin – microfiche.js

Animate scroll JavaScript / jQuery – animatescroll.js

How to detect images loaded – imagesLoaded jQuery plugin

Javascript Image Slider – Non jQuery

Responsive photo gallery slider – Jslide

Enjoy!