JQuery has overpowered Flash in a lot of web uses becoming a very powerful tool for web designers. One of these uses that I’m referring to is the image slider. Implementing this feature in your site will definitely count as a big plus so don’t waste your time and download the available jQuery plugins in this 30 Stunning jQuery Slider Plugins and Tutorials To Boost Your Work article.
You’ve probably noticed that a lot of websites lately have a featured area with content that slides or changes in some way. This is a great technique to show several pieces of content in a limited amount of space and a good way to engage the user.Content sliders are a great way to show large amount of content or images on a smaller area in a website or blog. They are commonly used in portfolio sites, corporate sites or blogs. You may probably heard that jQuery isn’t very hard to learn. If you are interested in implementing a content slider in your website please check our jQuery tutorials and plugins collection.
jQuery Sliders Plugins and Tutorials
JCoverflip
jCoverflip has been developed to enable fast and granular customization of the look and feel and feature set.
Create a Custom jQuery Image Gallery with jCarousel
This tutorial, we will learn how to build an unique jQuery script by modifying other plugin – create a Image gallery with jCarousel. A picture tells thousand words, we are going to transform jCarousel to this
Coin Slider
jQuery Image Slider Plugin with Unique Effects
loopedSlider
loopedSlider jQuery Plugin
Nivo Slider
Nivo Slider – The Most Awesome jQuery Image Slider
Colorful Sliders With jQuery & CSS3
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.
How to Create a Simple iTunes-like Slider
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.
Automatic Image Slider w/ CSS & jQuery
The html based image slider will have its benefits with SEO and will also degrade gracefully for those w/out js.
The Lof SiderNews Plugin
Base on the Jquery Framework and the Easing Plugin, The JSiderNews Plugin is a slideshow plugin that displaying images or type of content and support favious navigation to previous|next items.
Advanced jQuery background image slideshow
Read the rest of this article to learn how to create a beautiful advanced jQuery background image slideshow.
CJ Flashy Slide Show
Read the rest of this article to learn how to create a beautiful advanced jQuery background image slideshow.
Create a Quick MooTools Slideshow with Preloading Images
The following code snippet will show you how to create a simple slideshow with MooTools; the script will also preload the images and feature a progress message. Why preload images? They make the slideshow more elegant and you can avoid an onLoad mess. Oh, and chicks…loads and loads of chicks.
jqFancyTransitions
jqFancyTransitions is easy-to-use jQuery plugin for displaying your photos as slideshow with fancy transition effects.
Making a Mosaic Slideshow With jQuery & CSS
We are making a jQuery & CSS mosaic gallery. Mosaic, because it will feature an interesting tile transition effect when moving from one slide to another.
jQuery Blinds Slideshow using CSS Sprites
jQuery Blinds Slideshow using CSS Sprites
Multiple Image Cross Fade
we learn how to fade list of images through each other in continuous loop. We will also add captions and tooltips to make it more usable. This simple effect is ideal for portfolio websites, galleries or magazines where images need to be seen.
BarackSlideshow
I guess pretty much everyone has seen Barack Obama’s website by now, which is clearly one of the prettiest of all candidates we’ve heard of so far. Not only is it an example of state-of-the-art design, but it’s also nice to navigate and interact with.
The Mootool – Lof SiderNews Plugin
The Mootool – Lof SiderNews Plugin use for play a slideshow with the navigation display on the lef side or right side.
The LofCoolFlashNews Plugin
The LofCoolFlashNews Plugin
Floom Blinds-effect MooTools slideshow.
Floom Blinds-effect MooTools slideshow.
Create a Simple Slideshow Using MooTools Thumbnails and Captions
“Create a Simple Slideshow Using MooTools” series has been hugely successful. The first step was laying the groundwork for the slideshow, the second step was adding controls and events to the slideshow, and the third step was recoding the slideshow into a sexy class. This fourth slideshow tutorial will add thumbnail previews and captions to the slideshow.
Slide Thumbs
In this post I want to explain how to turn old boring image viewer into a nice-looking one with jQuery. It’s simple just using some lines of java-script code. Implement this and enrich animation features to your web projects.
Creating a Rotating Billboard System with jQuery and CSS
In this tutorial we will use some images, CSS and jQuery to create the effect of a rotating billboard with two ads. The idea is to make one set of image slices disappear while another one (the other ad) appear. We will decrease the width of each disappearing slice and increase the width of each appearing slice. This will give the effect of rotating slices, just like in a rotating billboard system.
Animate Panning Slideshow with jQuery
In today’s tutorial we’ll take the makings of a classic slideshow, but use a different kind of transition to animate between slides. It may not fit every project, but diversity is always welcome in the world of web design.
Create Featured Content Slider Using jQuery UI
There are a few tutorials on creating featured content sliders like the one from CSS-Tricks, but it uses jQuery Coda Slider plugin. Today I’m going to show you how to create a featured content slider for your website using the jQuery UI library.
Create Beautiful jQuery Slider Tutorial
This tutorial explains how to develop Create Beautiful jQuery sliders tutorial with image description and name.
CU3ER – Flash 3D Image Slider
CU3ER – Flash 3D Image Slider
The Piecemaker XML Gallery
To kick us off in style, here’s the awesome Piecemaker gallery created by Björn from Modularweb. Besides the freebie, you’ll find extensive documentation and a tut explaining the native 3D features of Flash CS4. Over to you, Björn..
UIZE JavaScript Framework
UIZE JavaScript Framework
jQuery Easy Slides v1.1
Possibly the easiest to use jQuery plugin for making slideshows!
Found something missing in this post?
While compiling this stuff on this post, it’s possible that we might miss some other great Content or Image Sliders which deserve to be in this list. So, do not hesitate to share it with us in Comments so that we can add instantly.
Categories
Pages
Text Ads
Subscription Options
Popular Posts
Community Feeds
Recent Posts
Friends & Sponsors
Recent Comments
Anurag
some great sliders are also available at evanto markets. anyways stunning collection….
Top Wordpress Themes
Wow these are some awesome jQuery Sliders…I was looking for a great free slider the other day and couldn’t find anything good on google so I settled for a premium slider…
This list will come very handy in the future. Thanks!
Carlos
These are great jQuery tutorials and sliders can’t wait to play around with them
Tutorial Lounge
really useful jquery plugins and also helping training you sharing. thanks
Wajid Khan
Thanks
Deluxe Blog Tips
Nice jQuery plugins. I like the slider plugins. Post all of them in a single post like this makes me easy to compare them. Thanks for sharing.
Cathy Mason
Nice sliders! Helpful article. Thanks!
ON&E
Really helpful compilation of slider resource…
thanks for sharing
Skywalker
The best jquery sliders compilation around by faaar!
Zavrab
nice collection, thanks
Neo
ugly men
lauren
thanks for sharing….. it really help me a lot….
waleed
also find my top jquery-image-content-slider for this month
http://blog.waleedmohamed.net/2010/07/top-jquery-image-content-slider-july.html
rogeliov
you can see also the jquery hover effect to my site…http://ownaproperty.blogspot.com
ramalho
Hi WEB Family,
Awesome jQuery Slider Plugins,Tutorials and are very useful.
Thanks for sharing
SEO master
Great collection. thanx!
Reedd
Thanks for sharing them really helps a lot and saves me time looking for these. Looking for part 2 of these plugins.
wendi.he
cool! i like them , very usefull for me !
graphic design
Wow! There are so many entirely out of the ordinary plugins in this compilation. It’s so nice to see the variation in people’s ability. It’s so inspiring.
Shahid
Hi Wajid,
Thanks for these nice plugins.
Alaa Al-Hussein
Awesome list.
I would like to share: Easy Gallery, a sliding jQuery gallery.
http://www.freelancer-id.com/easy-gallery/
Thanks
Iain
A good collection. Some real variety and good to see some unique choices.