10+ jQuery photo gallery and slider plugins

10+ jQuery photo gallery and slider plugins


10+ jQuery photo gallery and slider plugins

Introduction

A picture is worth a thousand words. No doubt about it. Most of the information based website such as CNN, ESPN, they are all using a massive photo slide show on its front page. It's a very effective method to attract viewers' attention.

So, here you go. 15 jQuery based photo gallery and sliders. Enjoy.

Advertisement

TN3 Gallery

TN3 Gallery | Demo

jQuery Cycle

TN3 Gallery is a full fledged HTML based customizable jQuery image gallery with slideshow, transitions and multiple album options. Compatible with all modern desktop and mobile browsers. Powered by jQuery.

jQuery Cycle

Official Website | Demo

jQuery Cycle

The jQuery Cycle Plugin is a lightweight slideshow plugin. Its implementation is based on the InnerFade Plugin by Torsten Baldes, the Slideshow Plugin by Matt Oakes, and the jqShuffle Plugin by Benjamin Sterling. It supports pause-on-hover, auto-stop, auto-fit, before/after callbacks, click triggers and many transition effects. It also supports, but does not require, the Metadata Plugin and the Easing Plugin.

Pikachoose

Official Website | Demo

Pikachoose

Pikachoose is a lightweight Jquery plugin that allows easy presentation of photos with options for slideshows, navigation buttons, and auto play. Pikachoose is designed to be easily installed, easy to setup, and well... all around easy. Creating an image gallery shouldn't be a complex thing. I've created a new plugin that I'm packaging with PikaChoose called SliderJS.

s3Slider

Official Website | Demo

s3Slider

The s3Slider jQuery plugin is made by example of jd's smooth slide show script. I needed something like that for jQuery (for my web site kruskica.net). Since i didnt find it after a small research i decided to build it by my self.

Galleria

Official Website | Demo

Galleria

Galleria is a javascript image gallery written in jQuery. It loads the images one by one from an unordered list and displays thumbnails when each image is loaded. It will create thumbnails for you if you choose so, scaled or unscaled, centered and cropped inside a fixed thumbnail box defined by CSS.

slideViewer

Official Website | Demo

slide viewer

slideViewer is a lightweight (1.5Kb) jQuery plugin wich allows to instantly create an image gallery by writing just few lines of HTML such as an unordered list of images

Image Flow

Official Website | Demo

Image Flow

Image flow is inspired by Apple's cover flow. The javascript renders the cover flow effect without any noticeable flaw. Keyboard navigation (arrow keys), mouse scroll and dragging is supported. Very cool script to use.

jQuery Gallery Scroller

Official Website | Demo

jQuery Gallery Scroller

jQuery Gallery Scroller (jqGalScroll) takes list of images and creates a smooth scrolling photo gallery scrolling vertically, horizontally, or diagonally. The plugin will also create pagination to allow you to flow through your photos.

Spacegallery

Official Website | Demo

space gallery

I particularly love this one. It's really cool. If you are familair with Apple's mac os leopard. Yes, this image gallery display photo just like the time machine does.

Easy Slider

Official Website | Demo

easy slider

Easy Slider (as I call this 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.

jFlow

Official Website | Demo

jFlow

A pretty neat photo slider. It featured in nettut, if you try to make yourself a photo slider. Visit this site.

Supersized

Official Website | Demo

supersized

A fullscreen photo gallery. It resizes images to fill browser while maintaining image dimension ratio. No extra whitespace, no scrollbars - the entire browser window is always filled.

Simple jQuery Slideshow

Official Website | Demo

simple jquery slideshow

A simple tutorial, and it shows us how to create a really simple jquery photo slideshow.

CrossSlide

Official Website | Demo

CrossSlide

CrossSlide is a jQuery plugin that implements in Javascript some common slide-show animations, traditionally only available to the web developer via Adobe Flash™ or other proprietary plugins. CrossSlide builds upon jQuery's animation facility, so it is as portable across browsers as jQuery itself (a lot.)

Innerfade

Official Website | Demo

innerfade

InnerFade is a small plugin for the jQuery-JavaScript-Library. It's designed to fade you any element inside a container in and out. These elements could be anything you want, e.g. images, list-items, divs. Simply produce your own slideshow for your portfolio or advertisings. Create a newsticker or do an animation.

Conclusion

I hope you all love this collection. :)

Author: Kevin Liew

Kevin Liew is a web designer and developer and keen on contributing to the web development industry. He loves frontend development and absolutely amazed by jQuery. Feel free to say hi to me, or follow @quenesswebblog on twitter.

Share the love

167 comments

prashant
Mon, 13th December 2010
Hi,
ur simply best to see ur work , kevin..

thanks Reply
Bhagwati
Tue, 4th January 2011
Thanks for sahring info with us, it's really great article Reply
sandeep raj giri
Sun, 9th January 2011
really its great.. Reply
james
Mon, 27th June 2011
good job!!! Reply
j.Query
Tue, 11th January 2011
Nice Collection. Here is a jquery image slider plugin called All-In-One. you can check out..
http://wp.me/pj2JM-73 Reply
Serg A.
Thu, 27th January 2011
Thanks for sharing, nice article. The latest jQuery Slider I found - http://wowslider.com/ , very interesting effects.. Reply
Saurabh Gupta
Wed, 2nd March 2011
Hey !! nIce work done by you guys/...thnx Reply
Ali
Thu, 3rd March 2011
Awesome plugins. :) Reply
Philip
Thu, 10th March 2011
Love the library ! Easy to customize ! awesome. Reply
Michael
Sat, 19th March 2011
The jQuery Slider Gallery does not work with any modern version. I found one that is similar that does work.

<a href="http://www.ajaxera.com/jquery-updated-slider-gallery/">http://www.ajaxera.com/jquery-updated-slider-gallery/</a> Reply
Fanklin
Sun, 27th March 2011
Nice collection Reply
RingZer0
Wed, 30th March 2011
Image Flow isn't jQuery... And it's licensed under creative commonts, not GPL. :P It should be removed and no credit given to it. Reply
sare
Tue, 24th May 2011
Great Collection and Very Nice Thinking Reply
Pritesh Gupta
Wed, 22nd June 2011
Nice collection. Reply
hossein
Mon, 27th June 2011
very good, thanks Reply
Cornelius
Mon, 4th July 2011
Neat plugins, the TN3 gallery is pretty slick. You may also want to check out jQuery Peepshow, demo here:

http://demos.zulius.com/jquery/peepshow Reply
muhammed misbah
Wed, 13th July 2011
superb and simple Reply
rklima
Sun, 24th July 2011
parabens, excelentes Reply
sonu goyal
Fri, 12th August 2011
thank you.. Reply
CKB
Thu, 25th August 2011
Thanks for the collection. Also, remember to place a (s) after "word" in the first line in your introduction section. - Just maintains the perfection of your site. :) Reply
Tyson
Thu, 8th September 2011
http://buildinternet.com/live/supersized/ - Supersized has broken image links in the demo. Reply
kabin
Thu, 29th September 2011
thanks for your sharing... Reply
Mark William
Fri, 21st October 2011
Such a lovely posting.
Thank you for sharing.. Reply
vad
Fri, 23rd December 2011
Take a look at www.flowslider.com Reply
Andrey
Sat, 24th December 2011
Photo wall with lightbox like at google photos: http://creotiv.github.com/jquery-photowall/ Reply
Sujoy Sengupta
Fri, 6th January 2012
Awesome Collection Reply
Ronny
Wed, 11th January 2012
All the products are amazing. Don't want to be rude or something but I think more features are needed. I want to customize the components more. For example, I don't know if you heard of www.flashxml.net but they have a lot of features, I mean I can customize all the product, do you think it is possible in the future updates to implement more features? And one more think that I liked on that website, it has some kind of "live demo" they called, and you can change settings instantly and after you choose your own settings you can download the component just how you customize it. I now it's much, but you can please do that for us? I am sure that all of us want something like that. Nice day to you guys! Reply
Vithul NK
Thu, 12th January 2012
Nice Collection Reply
rob
Thu, 12th January 2012
Nice post, I would add at this collection this gallery: http://www.flashxml.net/image-scrolling-gallery.html because looks pretty good and it's easy to customize. Thanks. Reply
malena
Fri, 20th January 2012
Awesome query.must use it. It’s changing the look of our site. Reply
BMo
Fri, 17th February 2012
Thanks, but what is with the next gen scroll gallery. http://wordpress.org/extend/plugins/nextgen-scrollgallery/ Reply
Johnny B
Sat, 18th February 2012
Great set! Here's one more that I found today: http://carousel.mgechev.com/. Reply
Robert
Mon, 12th March 2012
jQuery mouseSwipe with touch!
It's not open source but this plug-in works on all browsers plus ipod, ipad, android devices and is under 4kb. Jquery MouseSwipe with touch, vertical or horizontal.

http://torontographic.wordpress.com/
Reply
Saurabh
Thu, 22nd March 2012
Really Nice Plugins. HiccupSolutions Thanking you.. Reply
mishkat
Fri, 4th May 2012
why see me slider gallery Reply
phoenix
Sat, 5th May 2012
Most of these are NOT responsive. In 2012, they're basically useless. Also, please enable a "Subscribe to comments" feature on your blog. Thx Reply
Kevin Liew Admin
Sun, 6th May 2012
This is it: http://www.queness.com/post/11069/7-image-sliders-with-responsive-fluid-layout-support

Sorry we don't have subscribe to comment feature :/ Reply
Reeta Padihar
Wed, 23rd May 2012
Great Collection, Its really Nice and helpful to my creative team. Reply
prithviraj
Sun, 24th June 2012
www.wowslider.com its nice plugin friends try it
Reply
Alexandre Magno Teles Zimerer
Sun, 24th June 2012
I develop a slider plugin that I would like to mention too, jQuery Sliding plugin: http://blog.alexandremagno.net/en/2012/06/creating-sliding-itens-with-jquery-sliding/. This plugin have great features like cache elements in the dom, works well with ajax and have a methods, events and callbacks of a jQuery UI plugin. Reply
praveen
Tue, 3rd July 2012
This site have best example Reply
SHOBHIT
Wed, 10th October 2012
The subject of this article is also very capturing. Reply
kalatantra
Sun, 28th October 2012
Thanks for the share, really like: Reply
vinay
Tue, 15th January 2013
azade
Sun, 2nd March 2014
Very good, thanks for sharing. Please view my website about webdesign:
http://www.npco.net/
Reply
طراحی سایت
Sat, 26th April 2014
likeeeeeeeeeeeeeeeeee tanx Reply
طراحی وب سایت
Wed, 16th July 2014
thank you Reply

Leave a Comment

Please keep in mind that comments are moderated and rel="nofollow" is in use. You can use [code][/code] if you want to write codes. Don't spam us :) Thanks!

Advertisement