100 Best Free jQuery Image and Content Slider Plugins

RSlider

Credited as the first ever full screen responsive slider, this one features large rectangular slide topics or sections that can be clicked on to change the slide. There is also arrow navigation should it be needed.
Demo | Source

 

Quake Slider

Flexible pagination, thumbnail support, open source with over 40 transitions between slides. 3 different themes to choose between as well. Full explained with markup.
Demo | Source

 

SmartGallery

SmartGallery is a smart little slider with thumbnails that reveal once the dotted box is clicked. The slideshow displays in the center of the screen, and there are a range of different slide transitions included which are attractively done.
Demo | Source

 

Content/Thumbnail Slider

This is a rotating image slider with at least two areas where images are sliding around and a third that usually remain still.
Demo | Source

 

Smart Background Slider

This smart background image slider includes a full screen background, with a graphical and textual area in the foreground. Uses standard HTML for the written content, so it is fully accessible by today’s search engine bots for full indexing.
Demo | Source

 

Skitter

Super fast slider aptly named “Skitter” with five background themes and many different slide transitions to play around with. Button navigation with thumbnail previews when hovered over and arrow navigation also.
Demo | Source

 

Camera Slideshow

This is an elegant slider with simple navigation options and the ability run the slideshow on automatic. Button navigation is also available at the bottom.
Demo | Source

 

Craftyslide

This is a simple slider that removes the frills and keeps code down to just to 2kb. Includes attractive borders and button-based navigation.
Demo | Source

 

Elastislide

Elastislide is an interesting one. It is a picture carousel with some nice graphics surrounding it. Several different types of carousel are possible, so it is best to play around with ideas to get things how you want them.
Demo | Source

 

Blueberry

Blueberry was written by a theme developer who needed a slider that would be width responsive, but came up empty during a search. He therefore developed his own. With a wide bevel and tiny button navigation at the bottom, this one is unusual and attractive on the page.
Demo | Source

 

The Slidorion

The Slideorion features a text and sliding element on the right for several vertical tabs. Selecting one of them will create a transition effect for the slide on the slide. An effective slideshow for people that need to convey a lot of autobiographical information.
Demo | Source

 

Responsive jQuery Content Slider

This responsive jQuery slider adjusts perfectly as your browser changes size. Would suit mobile sites perfectly. Swipe support. Images and video supported. Button and arrow navigation.
Demo | Source

 

Minimit

The Minimit full width gallery jQuery code will create lovely transitions and transformations for you. Subtle changes are possible on the page with lovely use of color.
Demo | Source

 

BGNDGALLERY

This background gallery not only does full screen backgrounds, but other types of very colorful sliders as well. Great transition effects. All fully explained and code available.
Demo | Source

 

Fluid Thumbnail Bar with jQuery

This is a thumbnail bar across the middle of the screen with a series of images. Navigation either side if present to move things along. Basic, but effective.
Demo | Source

 

Fullscreen Slideshow With HTML5 Audio and jQuery

This is the busiest slideshow here with full screen viewing, built-in HTML5 audio for music and movie related sites. Good looking scrolling thumbnails across the top and the main image shown throughout the page.
Demo | Source

 

Moving Boxes with jQuery

Very clever transition effects and use of shaded and full color bring this template to life. You can play around with the menu items on the left and see the template come to life using the magic of jQuery.
Demo | Source

 

Innovation Slide

Innovation Slide is more of a demonstration that it is a functional piece of code one can image how to use. Or maybe not. It’s presented like a Scrabble letter which is then moved over and slide behind the next letter behind it.
Demo | Source

 

TN3 Lite

TN3 Lite is a free version of a premium slider. This one shows an image, with a caption at the top, and scrolling thumbnails at the bottom which move rather fast. Lovely photography show off what this little slider can do for you.
Demo | Source

 

Shutter Effect Portfolio with jQuery and Canvas

Shutter Effect is a little like the James Bond bit in the credits where a shutter opens to reveal 007. Here each new slide is revealed when the shutter reveals the image, then closes up again, and then repeats the process once more. Tutorial provided.
Demo | Source

 

Making a Flickr-powered Slideshow

With this slideshow you can use a Flickr photo collection to create slideshows, presentations or product guides to your heart’s content. Includes the recent Flickr API changes, so the slideshow runs fine with Flickr’s current implementation.
Demo | Source

 

How to Make Auto-Advancing Slideshows

Here is an attractive auto advancing slideshow with a tutorial to fully explain just how the guys at TutorialZine did it.
Demo | Source

 

SlidesJS

This is a responsive slider with widescreen slides, cool CSS3 animations, touch screen support and an easy setup.
Demo | Source

 

jCoverflip

This is a rotating cover flip with a slide control to travel through the covers. Coded before the latest jQuery updates, so it is good for sites not using the latest jQuery version.
Demo | Source

 

Awkward Showcase

The Awkward Showcase features a slider with tooltips. These are + shaped pink buttons within the image that contain extra information and can be easily coded into HTML. The usual slider transitions and other features are present. Useful for retail and tech sites especially.
Demo | Source

 

Nivo Slider

The Nivo Slider is well known for its beauty, fast load times and attractive transition effects. Offered as a HTML and WordPress version, this is one of the top sliders available.
Demo | Source

 

Flux Slider

The Flux Slider has some incredible 2D and 3D animations including in the HTML version and there is a WordPress version now too. Very slick indeed.
Demo | Source

 

Coin Slider

Slider with unique transitions, coin button based navigation and only 8kb so it loads real fast.
Demo | Source

 

Image Gallery With Fancy Transitions Effect

Here is an image gallery jQuery code with some nice transitions, photo credits and links. Basic text-based navigation left and right, and numbered slides below which are clickable.
Demo | Source

 

Animate Panning Slideshow with jQuery

This is a panning slideshow using widescreen sized images from Flickr. Includes diagonal panning, rather than just the usual left or right. A full tutorial is shown to explain exactly how they produced this effect.
Demo | Source

 

Sudo Slider

The Sudo Slider comes with 105 different effects for changing slides from one to the other. Many of these are demonstrated on their information resources too. This is a slider on steroids. If ever there was a transition effect that you wanted, the Sudo Slider is bound to offer it.
Demo | Source

 

Slick Auto-Playing Featured Content Slider

This is a content slider that is designed to fit on a web page and provide lots of visual information in a small space. Slides can be full image or contain a half section that is pure text. Thumbnails at the bottom can also be clicked on to change the slide.
Demo | Source

 

Dynamic Fun with SimplePie and jQuery

This is actually a blog roll with four graphical tabs. Each of these can be clicked on. The list of the latest posts are then slide out of view and a new list pushed into view depending on which tab was clicked.
Demo | Source

 

Exposure

Exposure is a close to full screen gallery with a main image slightly off center on the right and a steam of thumbnails on the left side. When clicked on, the center image will fade and change to the new image. There is also the option to auto-play the slideshow.
Demo | Source

 

Making a Content Slider with jQuery UI

This is a content slide that can display images and written copy side by side. You use the slide control at the bottom of the element to slide the content across.
Demo | Source

 

Featured Content Slider Using jQuery UI

The featured content slider is based on a blog element where recent post titles are shown and you can click on one to bring up more information in the content page. This familiar interface is well done with room for a nice image and a caption.
Demo | Source

 

Moving Boxes

Moving Boxes is a bit of an oddity. It is a small square slider with content that slides across using the buttons (the arrow navigation wouldn’t work on Firefox, but there is a newer version available on GitHub). The window “box” that is the slider would morph larger and smaller depending on the side of the next image. This is either quite cool or a pain with the rest of the page having to reformat to accommodate the changing size of the slider element.
wmuSlider, a jQuery responsive Slider
Demo | Source

 

wmuSlider, a jQuery responsive Slider

The wmuSlider is a responsive slider that works on many mobile devices. With cool navigational controls and transition elements, it’s worth a look.
Demo | Source

 

3D Gallery With CSS3 and jQuery

The 3D gallery displays, in the demo, three different screenshots of different product pages. Two are angled away and one is facing the viewer. When navigating to the next slide, the carousel rotates around so that the right image is now in the center. Very suitable for e-commerce sites.
Demo | Source

 

Orbit

Orbit is a nice looking slider with some large navigational elements and fast transitions. Small code side make it fast to load on a web page too.
Demo | Source

 

JC Play List

The JC Play List operates inside a player element. On the right is a play list which can be a list of articles if you like. Fast scroller can get you down a long list quickly. On the left is the selected image.
Demo | Source

 

Start/Stop Slider

The Start Stop Slider is a very interesting slider. It has a text element slding in to the left side of a slide and a clickable element arriving from the top and zooming down into position. There is also a pause button to freeze a slide if you want to look at it for longer.
Demo | Source

 

Revolver.js

A slider with some impressive controls including stop, start, restart, first, last and numbered slides.
Demo | Source

 

Agile Carousel

The Agile Carousel initially lacks navigation elements. The setup is stored in the JSON data format for ease of storage and implementation. There are in fact several different sliders, many of which have navigation, auto play options and more. These include an image carousel, three images as a single slide, a timer, fade transition effects and a content button option to show several stories & you click on the one you wish to see.
Demo | Source

 

GalleryView

GalleryView offers a good view of the main picture, with a series of large thumbnails below the main picture. These can be scrolled through to pick out the image that you want to see.
Demo | Source

 

Muslider

Muslider has many features not found in all other sliders. These include video sliders, audio slides with playback, a full text slide, and manual setting of the fixed width and fixed height for the container window.
Demo | Source

 

jQuery Common Accordion – Horizontal & Vertical

A horizontal and vertical accordion with diagonally transitioning slides. Beautifully done. Can add delays for the auto slide or only offer manual sliding. Just excellent.
Demo | Source

 

JQuery Based Flipped Image Gallery with Bounce Effects

This one offers again horizontal and vertical slides, but the slides move when you move the mouse over them and they move into position, then bounce back a little, then settle into position. Very slick indeed!
Demo | Source

 

Sliderman

Sliderman is a good little slider that has attractive transitions and arrow navigation. A link and image can be shown as a footer to each image, and button navigation is also shown below the image.
Demo | Source

 

Mask Transition Slideshow With jQuery

This final slider uses a tile effect, hiding images behind each other and revealing each one gradually by changing the tiles one by one. Full explanation is provided and there are control to change the speed, captions and titles.
Demo | Source