--
Published on Fri, Oct-22-2010 by Dainis

34 Useful jQuery Slider Plugins And Tutorials


jQuery sliders are amongst the highly popular jQuery plugins. You may use the sliders mentioned in this post on smorgasbord of online platforms, like portfolios, ecommerce websites and blogs. Creating slides for the portfolio items, product slides and featured articles are a cake walk with jQuery sliders. The popularity of jQuery plugins multiply manifolds in a short span of time.

You May Be Interested In The Following Posts


Hence, web developers are always creating plugins that outgrows the effectiveness of the previous ones. So, we are always keen to share the latest jQuery plugins with our readers to keep you all at about the industry trends. In case, you are interested in learning how to create these sliders, we have also added jQuery slider tutorials for you to create and customize your own slider.

jQuery Slider Plugins

jQuery Scrollable Autoscroll plugin

The Autoscroll plugin provides an automatic scrolling capability. It advances to the next items in pre-configured intervals. You can configure the number of items being scrolled and the interval of the scrolls. When navigational elements are mouseovered the automatic scrolling is paused.

jQuery Scrollable Autoscroll plugin

AnythingSlider jQuery Plugin

AnythingSlider is an attempt at bringing together the functionality of all of css-tricks.com previous sliders and adding new features. In other words, to create a really “full featured” slider that could be widely useful.

AnythingSlider jQuery Plugin

ImageSwitch

The main point of this plug-in is to make an easy-to-use, simple and fast plug-in to create effect when you switch between images. Minimize the arguments you need to input and still give some decent effects.

ImageSwitch

jCarousel

jCarousel is a jQuery plugin for controlling a list of items in horizontal or vertical order. The items, which can be static HTML content or loaded with (or without) AJAX, can be scrolled back and forth (with or without animation).

jCarousel

JCoverflip

jCoverflip has been developed to enable fast and granular customization of the look and feel and feature set.The default installation uses a clean style that can be updated with ease. All aspects of jCoverflip are customizable through the API. Coverflip is highly customizable.

JCoverflip

LoopedSlider

LoopedSlider is a plugin made for jQuery that solves a simple problem, the looping of slide content. It was created to be easy to implement, smooth and most of all end the “content rewind” that most other content sliders suffer from.

LoopedSlider

jqFancyTransitions slideshow with strip effects

jqFancyTransitions is easy-to-use jQuery plugin for displaying your photos as slideshow with fancy transition effects. jqFancyTransitions is compatible and fully tested with Safari 2+, Internet Explorer 6+, Firefox 2+, Google Chrome 3+, Opera 9+.

jqFancyTransitions slideshow with strip effects

Nivo Slider

Nivo Slider is a lightweight jQuery plugin for creating good-looking image sliders. It simply converts an element that wraps images into a slider and offers 9 unique transition effects. It can display pictures from your fileset with or without caption title.

Nivo Slider

Coin Slider

Coin Slider is a jQuery plugin that helps you create an image slider with unique effects by automatically slicing images into squares. It can creates random, swirl, rain and straight effects by changing order in which these squares appear to form complete image.

Coin Slider

BarackSlideshow

BarackSlideshow slideshow inspired by the one on Barack Obama’s website is a very tiny and lightweight slideshow script, that takes the power of MorphList to enhance visualization and navigation of the images.

BarackSlideshow

Floom slideshow

Floom slideshow is a MooTools plugin that can present images and photo captions pretty nice just auto-slides images. It displays them with a blind-effect and a chic loader that shows when the next image will be shown.

Floom slideshow

jQuery Easy Slides

This free jQuery image slideshow plugin is a favorite one for those users who don’t want to mess with too many options to create a simple slideshow for their website. It follows a very simple structure and provide options like: use HTML tags for captions, set slides interval and random slideshow option

jQuery Easy Slides

Quicksand

Quicksand is a reorder and filter items with a nice shuffling animation. At the very basic level, Quicksand replaces one collection of items with another. All you need to do is provide those two sets of items.

Quicksand

Moving Boxes

Moving Boxes is an jQuery “sliders” with Auto-Playing Featured Content Slider and again for the Start/Stop slider that are buttons to change panels and the panels zoom in and out. Moving Boxes comes with a keyboard support: arrow keys, spacebar, and enter key.

Moving Boxes

jQuery Infinite Carousel

jQuery Infinite Carousel is a plugin for jQuery that work in the same way the carousel worked on the Apple Mac ads page.

jQuery Infinite Carousel

Easy Slider

Easy Slider jQuery Plugin enables images or any content to slide horizontally or vertically on click. It is configurable with css alone. So, basically you link to plugin file, set the content up and style it with css.

Easy Slider

Supersized – Full Screen Background/Slideshow jQuery Plugin

Supersized is a jQuery plugin that automatically sizes (background) images to the size of the browser and runs them as a slideshow. Features include image resizing to fill browser while maintaining image dimension ratio, No extra whitespace, no scrollbars, ability to cycle through images/backgrounds via slideshow and it is compatible with Firefox, Safari, Opera, IE7, and IE6.

Supersized Full Screen BackgroundSlideshow jQuery Plugin

Animated JavaScript Slideshow

This dynamic JavaScript slideshow is feature packed and under 5KB. A few new features include description support, link support, no naming restrictions, portrait image support, graceful degradation and active thumbnail status.

Animated JavaScript Slideshow

Aviaslider

AviaSlider is a very flexible and easy to use Image slideshow plugin for jQuery with few really unique transitions that were never available before, as well as some basic transitions, so the slider will fit into every project. It comes with an image preloader so the slider starts when images are ready to be shown. No clumsy animations with half loaded images.

Aviaslider

Galleriffic

Galleriffic is a jQuery plugin that provides a rich, post-back free experience optimized to handle high volumes of photos while conserving bandwidth

Galleriffic

jQuery Slider Tutorials

Build a Content Slider with jQuery

In this tutorial you will learn how to create an easy-to-implement content slider plugin that allow for multiple instances on a page and allow users to customize the size, button images, etc. And of course you will create valid markup.

Build a Content Slider with jQuery

Colorful Sliders With jQuery & CSS3

In this tutorial we are using jQuery and the new transformation features brought by CSS3 to create a three dimensional dynamic slider effect. The techniques presented here – for creating sliders, and CSS dynamic resizable bars, can be used together or in part for powering all sorts of jQuery goodness.

Colorful Sliders With jQuery and CSS3

How to Create a Simple iTunes-like Slider

In this tutorial you will take a look at how to create a slider similar to the one used in the iTunes store. A simple slider/slideshow which mostly emulates the one on iTunes barring a few changes. Click the down button to cycle the images.

How to Create a Simple iTunes-like Slider

Automatic Image Slider w/ CSS & jQuery

An in-depth tutorial for building a simple, no-Flash slideshow with jQuery and CSS. The html based image slider will have its benefits with SEO and will also degrade gracefully for those w/out js.

Automatic Image Slider w/ CSS and jQuery

Create Featured Content Slider Using jQuery UI

In this tutorial author will show you how to create a featured content slider for your website using the jQuery UI library.

Create Featured Content Slider Using jQuery UI

Creating a Slick Auto-Playing Featured Content Slider

This tutorial allows you to create a great content slider using jquery and css. This amazing content slider is very light and easily to install.

Creating a Slick Auto-Playing Featured Content Slider

A Beautiful Apple-style Slideshow Gallery With CSS & jQuery

Learn to create a stylish jQuery slideshow in minutes with this step by step tutorial.

A Beautiful Apple-style Slideshow Gallery With CSS & jQuery

Making a Google Wave History Slider

In this tutorial you will learn how to create a Google Wave-like history slider. Using it, you will enable your visitors to go back and forth in time to view the changes that take place on a comment thread. You are free to modify it and download the source code.

Making a Google Wave History Slider

Building a jQuery Image Scroller

In this tutorial, we’re going to be building an image scroller, making use of jQuery’s excellent animation features and generally having some fun with code. Image scrollers are of course nothing new; versions of them come out all the time.

Building a jQuery Image Scroller

Animate Panning Slideshow with jQuery

Highly visual websites rely on the ability to showcase imagery automatically. Whether it be a professional photographer or zoo, slideshows pop up so frequently because they work well.

Animate Panning Slideshow with jQuery

Using jQuery Slider to Scroll a Div

This tutorial is going to show how to create a horizontally scrolling div using jQuery, html, and css. The main part of this tutorial is going to focus on the jQuery which is used to build the slider which controls the scrolling.

Using jQuery Slider to Scroll a Div

jFlow Plugin

jFlow is a very light-weight slider. If you’ve been using sliders in your web design for some time perhaps you’ve had experiences with a few jQuery sliders that hasn’t been so good. jFlow out-of-the-box is good, but let’s make it great. One of the most requested features for this slider is to have the popular pause and autoslide functions.

jFlow Plugin

Presentation Cycle

This script generates a progress bar automatically instead of the developer adding some html. Depending on the settings of the script, it dynamically generates a progress bar adjusted to the number of slides in the Cycle container.

Presentation Cycle

Advertisement


6 Responses

Leave Your Response

About PsDeluxe

Psdeluxe is a Design blog dedicated to mainly Photoshop lovers and enthusiasts. We regularly update blog with free and easy to learn free Adobe photoshop tutorials, useful freebies for design projects, powerful tools that will make your work easier and we publish showcase of most beautiful and interesting designers works around the work that hopefully will inspire. Learn Adobe Photoshop techniques with us. Talented and professional designers are always welcome to join our author team. Feel free to subscribe to our Rss feed to be first who get all valuable information for designers.



     Technology news | Wordpress templates | ThemeLabs | Review themes

Recommended Links



Wordpress review theme