Cool and Useful jQuery Image and Content Sliders and Slideshows

May 23rd, 2011

Looking for some cool new (and free) jQuery slider plug-ins and scripts? Then here is the perfect round-up created just for you. Here, we have collected the best of the freshest jQuery plug-ins for creating amazing image and content sliders. Because all of these plug-ins come with different functionality, this guide should help you figure out which one suits you best. Let’s go!

jQuery Image And Content Sliders

Cloud Carousel (demo | download)

Here is a 3-D carousel, with optional auto-reflection that doesn’t require images to be modified or server code to be added. Accurate 3-D perspective and easy integration with basic valid HTML, all with a tiny bit of JavaScript.


ShineTime (demo | download)

“A new kick-ass jQuery and CSS3 gallery with animated shine effects.” This effect will make user interface elements look like they’re a polaroid photo (or made of glass). The best part is that it’s not that difficult to achieve.


Nivo Slider (demo | download)

Nivo Slider is an awesome and lightweight jQuery plug-in for creating attractive image sliders. It simply converts a wrapper for images into a slider, and it offers nine unique transition effects.

Screenshot Content Switcher with jQuery and CSS3 (demo | download)

The goal of this project was to recreate’s switcher without any extraneous images or other non-essential elements that tend to make stuff less maintainable.


Create Scrollable Interface (demo | download)

This jQuery plug-in creates a scrollable interface with which to scroll over a large image in a small area.


Beautiful Photo Stack Gallery with jQuery and CSS3 (demo | download)

The idea here is to show photo albums with a slider, and when an album is chosen, its images are displayed as a beautiful photo stack. In this stack view, you can browse through images by tucking the one on top under the stack with a slick animation.


Micro Image Gallery: A jQuery Plugin (demo | download)


Minimalistic Slideshow Gallery with jQuery (demo | download)

This simple and beautiful slideshow gallery can be easily integrated in your website. The slideshow is in a container, with options to view a thumbnail grid, pause the slideshow and navigate through the pictures. The grid slides out from above and allow the user to navigate the thumbnails.


Image Slider with Unique Effects (demo | download)

This coin-slider jQuery image plug-in has several transition effects.


Create image gallery in 4 lines of jQuery (demo | download)


Slideshow with strip effects (demo | download)

jqFancyTransitions is an easy-to-use jQuery plug-in for displaying photos as a slideshow with fancy transition effects.


Nivo Zoom (demo | download)

Nivo Zoom is a free jQuery image zoomer intended as a replacement for a lightbox.


AD Gallery, gallery plugin for jQuery (demo | download)

A highly customizable gallery and showcase plug-in for jQuery.


Animate Panning Slideshow with jQuery (demo | download)


Image Scale Carousel (demo | download)

When working with images online, keeping the aspect ratio intact is as important as anything. That is what’s so nice about this jQuery plug-in: you don’t have to worry about sizing all of your images perfectly. It auto-scales your images for you, making implementation super-simple.


Sudo Slider (demo | download)

Essentially, Sudo Slider is a slider plug-in that allows you to do whatever you want, with whatever HTML you want. It’s both a content and image slider


GALLERYVIEW (demo | download)

GalleryView is a content gallery plug-in capable of displaying any HTML content in an animated gallery view. Visit the project’s home page for documentation and demonstrations.


Jquery Plugin MopSlider 2.4 (demo | download)

MopSlider is a slider box that can contain any item with a set height and width. With version 2.5, MopSlider can be added to a page however many times you want. An auto-move function is included.


jQuery Image Scroller (demo | download)

Making use of jQuery’s excellent animation features, this image scroller is completely autonomous and begins scrolling once the page loads. The finished widget is completely cross-browser compatible and performs as expected in the latest versions of the most common browsers.


Image Gallery Using jQuery and Flickr (demo | download)


jQuery plugin: Wilq32.RotateImage (demo | download)

This is the product of the Wilq32.PhotoEffect snippet. You can use this tiny script to rotate images (at any angle) directly on the client side (e.g. with user-generated content) and animate them using your own functions.


jQZoom Evolution (demo | download)

JQZoom is a JavaScript image magnifier built on jQuery. The script makes it easy to magnify whatever you want.


Photo gallery using jQuery and VisualLightBox (demo | download)

Zoomimage (demo | download)


YoxView (demo | download)

YoxView is a free lightbox-type media and image viewing jQuery plug-in. It’s easy to use and feature-rich.


Supersized (demo | download)

This plug-in resizes images to fill the browser while maintaining their dimensions. You can cycles images and backgrounds in a slideshow with transitions and preloading. And navigation controls allow for “Pause/Play” and “Forward/Back.”


AnythingSlider (demo | download)


Photo Revealer (demo | download)

With this, you get a line of cropped thumbnails on a string. Clicking the “More Info” button expands a photograph to full size and reveals additional information. Photos are loaded on page load, so there is no waiting after clicks.


Exposure (demo | download)


Auto-Playing Featured Content Slider (demo | download)

This is an alternative to the jQuery Coda Slider plug-in. With this, a slide can be any kind of HTML content whatsoever, even a full-size image with overlay. Each slide has a unique thumbnail that, when clicked, takes you to the corresponding slide, with an arrow above indicating the active panel. And it auto-plays!


Horinaja (demo | download)

Horinaja is a ready-to-use slideshow that can be used with either Scriptaculous/Prototype or jQuery. It allows you to use the mouse wheel for navigation; when the mouse is outside of the slideshow area, it scrolls; when hovering over the slideshow, scrolling pauses.


S3 Slider (demo | download)

This one’s easy. First, enable the jQuery library, and then include the S3 Slider JavaScript in the head of the page where you want to use it.


Slide Deck (demo | download)

SlideDeck is a powerful plug-in that lets you organize any type of content into a beautiful and user-friendly slider.


Galleriffic (demo | download)

A jQuery plug-in for rendering rich fast photo galleries.


Photo Gallery – Dark Theme (demo | download)

GalleryView decides the best way to animate your filmstrip. When the gallery is wider than the filmstrip, the filmstrip remains stationary and the pointer slides from frame to frame. When the filmstrip is too long for the gallery, the pointer remains still and the filmstrip animates beneath it.


jQuery morphing gallery (demo | download)

A gallery that “morphs” images between transitions.


Simple Accordion w/ CSS and jQuery (demo | download)

Designed and implemented with usability in mind, this accordion can come in very useful when organizing a good chunk of content.


Automatic Image Slider w/ CSS & jQuery (demo | download)


Create a Slick and Accessible Slideshow Using jQuery (demo | download)

A usable and accessible slideshow widget for your website that uses HTML, CSS and JavaScript (via jQuery).


Fancy Thumbnail Hover Effect w/ jQuery (demo | download)


Coda Slider Effect (demo | download)


Simple Controls Gallery (demo | download)

Want to display images as an automatic slideshow that can be played or paused by the user? Simple Controls Gallery displays an image by fading it into view over the previous one. Navigation controls pop up when the mouse rolls over the gallery.


Popeye (demo | download)

jQuery.popeye is an advanced image gallery script built on jQuery. Use it to save space when displaying a collection of images, and offer users an elegant way to show big versions of images without disrupting the page flow.


Simple demo (demo | download)


ImageFlow (demo | download)

ImageFlow is an unobtrusive and user-friendly JavaScript image gallery.


Moving Boxes (demo | download)


SlideViewerPro (demo | download)

SlideViewerPro is a fully customizable jQuery image gallery engine that allows you to create outstanding sliding galleries or interactive galleries in blog posts.


Pirobox (demo | download)


jQuery simple panorama viewer (demo | download)

This small plug-in for jQuery will display any image on the page that has the class panorama as an interactive panorama.


A Beautiful Apple-style Slideshow Gallery (demo | download)


Flickr Photobar Gallery (demo | download)

The aim here was to build a bottom photo bar that one could easily integrate into a website. It is hidden initially and slides up when the handle is clicked. The photo sets are first shown and when one of them is chosen; all of the set’s images can be viewed as thumbnails; when a thumbnail is clicked, the full view appears as an overlay.


Step Carousel Viewer (demo | download)

Step Carousel Viewer displays images and even rich HTML by side-scrolling them left and right. Users can jump to any panel on demand or browse the gallery by scrolling through any number of panels at a time. A smooth sliding animation is used to transition between items. And don’t worry, you can tame this script to do exactly want you want: two public methods, two custom event handlers, and three “status” variables are available for this purpose.


Zoom-Info (demo | download)


Box Slider (demo | download)


jQuery Panel Gallery (demo | download)

An attractive and beautiful image slideshow plug-in, with a classic transition effect.


Image Highlighting and Preview with jQuery (demo | download)

A nice way to allow users to view bigger versions of images with some context.


Interactive Photo Desk (demo | download)

With this utility, photos can be dragged and dropped, stacked and deleted, with each action resembling a real-world action.


Multimedia Gallery for Images, Video and Audio (demo | download)


Awesome Mobile Image Gallery Web App (demo | download)

A simple mobile image gallery, using the amazing jQTouch jQuery plug-in for mobile Web development. jQTouch has native animations, automatic navigation and themes for mobile Webkit browsers like those on the iPhone, iPod Touch, G1 and Pre.



Nousheen Aquil is a web graphic designer. She loves photography, drawing and painting. She also is a contributing member of WebdesignCore , a platform that focuses on free web resources and inspiration for designers and developers.

Tags: , , ,

51 comments for „Cool and Useful jQuery Image and Content Sliders and Slideshows
  1. SK on May 23rd, 2011 at 12:09 pm

    Nice and useful list of awesome slider.. will definitely be helpful in all my future web design projects. Thanks for sharing!

  2. aditia on May 23rd, 2011 at 1:53 pm

    what a huge list that 4 lines jquery code sounds cool

  3. Tommy on May 23rd, 2011 at 3:39 pm

    Another nice jQuery Image Gallery plug-in for your collection

  4. Paginas Internet Puerto Rico on May 23rd, 2011 at 3:57 pm

    Content sliders are have now become very popular and you can see them in thousand of blogs and websites.It is useful for a blog owner to show the featured contents and i also think it is a great way to attract the visitors which also gives a beautiful look to blogs.

  5. Sanjib C on May 23rd, 2011 at 4:07 pm

    Super like !! :) Loved the post.

  6. Daniel Sawyer on May 23rd, 2011 at 8:14 pm

    Wow that’s a lot. I can see why you missed this one:

  7. WD Chef on May 23rd, 2011 at 8:37 pm

    This article looks more like a slider database. :) Awesome post.

  8. Fareed khan on May 23rd, 2011 at 9:55 pm

    This is awesome tutorial, Slide show is make site design a better design,this post will really help to the professional and also for me…Thank you very much

  9. J Rizzo on May 24th, 2011 at 5:00 pm

    Thanks for the collection. I love the idea behind the Popeye compact slideshow and the SlideDeck with multiple layers. Both are very smart and space sensitive.

  10. Robert Bowen on May 25th, 2011 at 10:04 pm

    Thanks for the kind words, everyone. Glad the post has proven so inspiring and useful!

  11. Venkatesh on May 26th, 2011 at 12:40 pm

    It’s Amazing!!! Thanks!!!

  12. Emprego on May 27th, 2011 at 5:25 pm

    Excellent collection of galleries. Already a favorite.

  13. jjroelofs on June 5th, 2011 at 11:34 am

    Did you leave out jQuery cycle on purpose? Because it’s one of the oldest plugins and I personally still like it.

  14. Mark on August 7th, 2011 at 8:07 am

    Very nice collection. However, I cannot seem to find a horizontal accordion here, only a vertical one. The JQuery UI doesn’t seem to have one either. Can anyone point me in the direction of an excellent plugin please?

  15. Keshav Naidu on August 10th, 2011 at 11:06 am

    Great collection. thanks !

  16. fullindir on November 19th, 2011 at 4:37 pm

    Thank you for the post . I like it

  17. Dheeraj Bansal on December 1st, 2011 at 7:19 pm

    This is really an awesome blog. every time I find this blog very helpful in solving web designing related queries.
    Thanks again..

  18. David Knapp on January 16th, 2012 at 1:42 pm

    I’m just looking for a content slider like Bleacher Report uses. I cannot find it anywhere? Any clue where to find something like that? Thanks!

  19. iTechColumn on January 26th, 2012 at 7:13 am

    Amazing collection.. Thanks so much :)

  20. Alicka on January 29th, 2012 at 9:51 am

    The link to “jQuery Image Scroller” although the link from image is going to the right place, but from the Demo and Download Anchor it is not.

    By the way thanks for the great source, it is really going to help me a lot in my designing.

  21. Peter Lee on January 31st, 2012 at 8:49 pm

    Nice job with the collection of slides. Keep up the good with with the web development library of J query sliders.

  22. Adam on February 7th, 2012 at 4:25 am

    The photo stack gallery slider was exactly the effect I was looking for on a current project. Thanks for the great resource!

  23. Roger on February 11th, 2012 at 12:07 am

    PhotoStacker – I got the photos to come on but it seems like the PHP file is not being recognized. Where do you put it and how does it get activated. The other items are the TITLE and the ARROW do not show either. The slides come up and you can move thru them but you can not activate the photos?

  24. Rico Figliolini on March 1st, 2012 at 2:44 pm

    I like these jquery galleries, but can anyone point me in the right direction for a mashable like gallery with a slide box? similar to what is at this It seems to be a lightbox based gallery. I really like the slide box on the right that can contain caption text and a google adense ad.

  25. Mohammed on March 6th, 2012 at 8:51 am

    nice job

  26. Bhavesh on March 26th, 2012 at 9:37 am

    Best Collection

  27. sikander on March 26th, 2012 at 8:45 pm

    Great work , dont need to visit any site after this one is found

  28. Minhaj on April 3rd, 2012 at 3:04 pm

    Love it

  29. tuba on April 4th, 2012 at 12:52 am

    cool list!

    I am looking for a slider which will change the background, however the list provided here is no doubt very helpful.thanks!

  30. Bishwa Ranjan on May 8th, 2012 at 1:12 pm

    Excellent and amazing slider. I loved it..

  31. Lekhnath Khanal on May 9th, 2012 at 9:19 pm

    Really cool sliders..:)
    Great job..(y)

  32. Nedim Sabic on May 15th, 2012 at 6:45 pm

    Really great compilation! Thank you very much for your effort. Some of them I’ve never seen!

  33. Damu on May 21st, 2012 at 4:24 am

    i was after slider that scrolls automatically and shows 3 blocks at a time. may be i can modify the one by dynamic drive above.

  34. Revan on May 29th, 2012 at 8:32 am

    Nice collections ………………..
    It’s useful for so many designers who want their slides in a different way.

  35. RONAK on June 11th, 2012 at 8:56 pm

    wow ! thats gud ….its amazing slider free store….thanks admin.. !!!!!

  36. Dimi on July 4th, 2012 at 3:41 pm

    thanks for sharing these useful resources

  37. Haris Kotta on July 13th, 2012 at 7:52 pm

    really !…it’s very helpfull, Thank you .

  38. gifeasy on July 20th, 2012 at 12:00 pm

    Good information for jquery slide show

  39. abhi on August 7th, 2012 at 2:15 pm

    I like these jquery galleries

  40. abhi on August 7th, 2012 at 2:16 pm

    really amaging web site

  41. Pouya on August 16th, 2012 at 1:50 pm

    Goood. I like your website. :D

  42. salim sazzad on August 28th, 2012 at 11:53 am

    Thanks,. That’s really a cool list.

  43. Faiqa on September 12th, 2012 at 9:49 pm

    it’s really useful…..i really appreciate this work…..well done

  44. valarmathi on September 21st, 2012 at 11:23 am

    really super slides and i excite a lot…. really your site design admires me… thanks a lot to share…

  45. Abolfazl Beigi on September 25th, 2012 at 11:04 am

    Big help. thanks.

  46. Adam Nguyen on December 6th, 2012 at 5:59 am

    Thanks for sharing :)

  47. Heramb Belnekar on January 10th, 2013 at 10:41 am

    Amazing !

    Thanks for given such a wonderful and helpful information about slideshow.i loved it..:)

  48. saqib on January 16th, 2013 at 12:01 pm

    thnks nice information

  49. Hamid on January 31st, 2013 at 8:04 pm

    These are cool nice plugins
    tnx so much

  50. Tshering on March 12th, 2013 at 10:50 am

    Thanks. Nice Collection.. Gonna help me a lot

  51. Businge Brian on April 17th, 2013 at 8:17 am

    this is like christmas, i have never landed on a cool selection of jquery sliders like this on. i must say am impressed. this is all i needed. thanks