20 jQuery Sliders for Frontend Web Developers

Image and content sliders are an extremely common element in modern web design. Coding your own slider from scratch is always an option, but if you’re looking to save some time or if you’re not sure how to code your own slider there are plenty of options. In some cases working with an existing jQuery plugin will save you time instead of writing code from scratch.

In this post we’ll look at 20 different options for jQuery sliders. Many of them allow you to create responsive sliders, and some are optimized for mobile users as well. Most of these options are free.

Slider Revolution

Slider Revolution is a premium WordPress plugin ($15) that allows you to easily create and customize responsive sliders. It comes with 20 different transitions, it’s touch enabled, and you can include just about any content you want within your slider.

Slider Revolution

Wow Slider

Wow Slider is an “awesome slider for non-coders”. It is a responsive slider with plenty of beautiful visual effects, and what makes it unique is the point-and-click wizard that makes it possible to create sliders with no coding.

Wow Slider

Nivo Slider

Nivo is possibly the most popular jQuery slider plugin. It is free to download and use (WordPress plugin is not free, costing $19 for a single site license). Nivo comes with 16 different transition effects, it’s responsive, and it’s easy to work with.

Nivo Slider

Simple Multi-Item Slider

The Simple Multi-Item Slider is a great option for e-commerce sites, and for other sites looking to display items and products. It uses some nice CSS animations as well as jQuery to create a very attractive item display.

Simple Multi Item Slider

Fullscreen Slit Slider with CSS3 and jQuery

The Fullscreen Slit Slider from Codrops is a unique slider with some interesting transition effects. Instead of simply sliding, it slices open the slide as it transitions to the next slide.

Full Screen Slit Slider

Parallax Content Slider with CSS3 and jQuery

If you’re looking for a slider that will allow you to include content as well as images, the Parallax Content Slider could be a good choice. It uses CSS3 animations with each single element, so you have a lot of control.

Parallax Content Slider

Rotating Image Slider with jQuery

If you’re looking for a unique slider that will help your site to stand out, this is a great option. Instead of simply slider images in and out it gives theme a slight rotation, which creates a really interesting slider that visitors will love.

Rotating Image Slider

Parallax Slider with jQuery

This sliders moves the background when sliding an image, creating an interesting parallax effect that separates it from more typical sliders.

Parallax Slider

Slider Gallery with jQuery

This slider displays thumbnails in a horizontal slider. As is shown in the demo, it is great for photography websites to display photos in different categories.

Slider Gallery

Unslider

If you’re looking for a simple and lightweight slider, unslider is a great option. It allows you to create a responsive slider, but it doesn’t have tons of fancy transition effects to chose from.

Unslider

Unoslider

Unoslider is designed to be responsive and with mobile users in mind. It is touch enabled and mobile optimized, plus it offers unlimited transitions and is easily themeable.

Unoslider

Responsiveslides.js

Responsiveslides.js is a simple and lightweight jQuery slider. It creates a responsive slider using elements inside a container.

Responsiveslides.js

Camera

Camera is a responsive slider using jQuery mobile so users can mobile users can scroll through slides easily on a touchscreen. The are plenty of options for customizations and it supports HTML and video in addition to just images.

Camera

SlidesJS

SlidesJS is a responsive slider with features like touch support and CSS3 transitions.

Slides.js

bxSlider

bxSlider is responsive and mobile-friendly. You can create sliders with horizontal, vertical, or fade transitions. Your slides can contain images, video, or HTML, and there are tons of configuration options.

bxSlider

Basic jQuery Slider

The Basic jQuery Slider is a good option if you are looking for a simple slider that you can easily customize. It is intended to be a starting point without tons of features.

Basic jQuery Slider

Elastislide

Elastislide is a responsive image carousel that can be laid out horizontally or vertically and will adapt fluidly within your layout. It displays thumbnails in an attractive presentation.

Elastislide

RSlider

RSlider is a fullscreen responsive slider that supports categories.

RSlider

FlexSlider

FlexSlider is a free option from WooThemes. It offers horizontal and vertical slides, plus fade animations.

Flexslider

SlideDeck

SlideDeck is a premium WordPress plugin ($49 for a single site license). It’s extremely popular because it offers a ton of useful features and because it is easy to set up beautiful responsive sliders from within the WordPress dashboard without any coding. For designers/developers who prefer to code their own slider, or to customize the code of an existing slider, SlideDeck may not be the ideal option. But for end users who want to be able to create sliders without the need to mess with code, it can be a great choice.

SlideDeck

For more web dev resources check out these related posts:

Looking for hosting? WPEngine offers secure managed WordPress hosting. You’ll get expert WordPress support, automatic backups, and caching for fast page loads.

Join the Newsletter

Subscribe to our weekly newsletter chalked full of useful tips, techniques, and design goodies.

Popular WordPress Themes

More Design Inspiration

BlueHost