60 Excellent jQuery Image Sliders and Tutorials
jQuery Image Sliders
1. FancyMoves
FancyMoves is a great slider to show off services, products, or whatever you can dream up. The main image is enlarged to attract your focus. There are three ways to navigate to the next / last item: using your keyboard arrows, using the left and right arrows on the sides of the slider, or simply clicking on the next or last item in the slider.
2. Easy Gallery
Easy Gallery allows you to add a simple image gallery with albums and subalbums to your site. It uses a pretty lightbox to display the large images with a thumbnail navigation below it to allow easy navigation to other images.
3. Jflow
jFlow Plus is an update to the popular ultra-light-weight jFlow slider. This new addition comes with an auto slide an pause functionality and will be continually updated with additional features. jFlow Plus is an easy to implement, customizable and light-weight jQuery slider that is a great solution for you project needs.
4. Supersized
Supersized is a fullscreen slidehow jQuery plugin. It supports image preloading with image cycling with transitioning effect.
5. Orbit
Orbit is a killer jQuery plugin that lets you create a simple, effective and beautiful slider for images of any size, and even includes some parameters for making awesome captions and a sweet timer.
6. Anything Slider
AnythingSlider is a jQuery Plugin with a lot of features( Slides can be anything, Navigation tabs are built and added dynamically.
7. JQuery LightBox
jQuery lightBox plugin is simple, elegant, unobtrusive, no need extra markup and is used to overlay images on the current page through the power and flexibility of jQuery’s selector.
8. Coin Slider
A Jquery Image Slider with unique effects.
9. Nivo
This is a new launched image slider what use jQuery. Is cross browser and have 9 unique transition effects, navigation controls, is simple, clean, valid markup and free.
10. Featured Content Slider
11. Easy Slider
Easy Slider is a jQuery plugin, you can set up your own options and is easy to implement.
12. Cycle
The jQuery Cycle Plugin is a slideshow plugin that supports many different types of transition effects.
13. Dragdealer
Dragdealer is much more than a simple image slider. It offers a wide variety of features related to dragging, but is also quite powerful for creating different types if image sliders.
14. JqFancy Transitions
jqFancyTransitions is easy-to-use jQuery plugin for displaying your photos as slideshow with fancy transition effects.
15. 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.
16. Horinaja
Horinaja is a ready-to-use slide-show implementation, utilizing either scriptaculous/prototype or jQuery. A running example above
- allows you to use a mousewheel for navigation.
- automatically create slide indices (pagination), if required
17. JQueryGlobe – JQuery Plugin
This jQuery plugin enables simple and easy creation of an interactive “Featured Items” widget.
- Slick effect, no Flash needed
- It’s just 2K
- Reusable on multiple containers
- Cycles items via slideshow
- Can be styled with custom HTML/CSS
18. Agile Carousel
Jquery plugin that allows you to easily create a custom carousel. Call Jquery UI to enable many different additional transition types and easing methods. Uses PHP to draw images from the folder you specify. Configure many different options including controls, slide timer length, easing type, transition type and more!
19. Looped Slider
20. Piecemaker XML Gallery
Piecemaker is an open source 3D Flash image rotator gallery.
21. AviaSlider
Very feature rich and good looking image slider.
- 8 unique transition effects
- Lots of easy to set options to create your own effects
- Included Image preloader
- Autoplay that stops on user interaction
- Valid HTML5 and CSS 3 Markup
- Packed version only weights 8kb
- Supports linked images
- already prepared to work with prettyPhoto Lightbox
- works with jQuery 1.32 and higher
- Internet Explorer 6 and higher
- Safari 3 and higher
- Firefox 2 and higher
- Opera 10 and higher
- Google Chrome 3 and higher
- Checks for last 3 Browsers performed on Mac & Win
22. Slide Deck
Slide Deck is an easy to implement with a great design.
23. Simple Slide
Simple Slide is a jQuery slideshow plugin. It’s easy to use, small and flexible.
24. Yoxview
YoxView is a free image and video viewer for websites. It’s written in javascript using jQuery and is available as a jQuery plugin.
25. Moving Boxes jQuery slider
26. Simple Controls Gallery v1.3
Simple Controls Gallery rotates and displays an image by fading it into view over the previous one, with navigation controls that pop up when the mouse rolls over the Gallery.
27. Animated JavaScript Slideshow
This dynamic JavaScript slideshow is feature packed and under 5KB. It is the long awaited update to my previous script here. A few new features include description support, link support, no naming restrictions, portrait image support, graceful degradation and active thumbnail status.
28. Space Gallery JQuery Plugin
29. jCarousel Lite
jCarousel Lite is a jQuery plugin that carries you on a carousel ride filled with images and HTML content. Put simply, you can navigate images and/or HTML in a carousel-style widget. It is super light weight, at about 2 KB in size, yet very flexible and customizable to fit most of our needs.
30. Start/Stop Slider
The slider does feature a stop/start button and the animation goes a little farther than simply sliding to the left.
31. Coda Slider Effect
32. jQuery Infinite Carousel
Scrolling carousel that worked in the same way the carousel worked on the Apple Mac ads page.
33. Exposure
Exposure is a jQuery plugin for rich and smart photo viewing that can handle very large amounts of photos.
34. jQueryRotate
This is an final product of a Wilq32.PhotoEffect Snippet (browse blog to get more information). Actually you can use this simple and tiny script to rotate images (any angle) directly on client side (for ex. user generated content), and animate them using own functions.
35. Zoomimage
Present your images in a stylish way, with this plugin. The links are unobtrusively highjacked to open the images in an inpage popup with drop shadow and border. Nice and simple.
36. Image Rotator
An image rotator is one great way to display portfolio pieces, eCommerce product images, or even as an image gallery. Although there are many great plugins already, this tutorial will help you understand how the image rotator works and helps you create your own from scratch.
37. jQuery Image Gallery/News Slider
A really cool News Slider that uses two scrollers to create very slick effect. It uses scrollTo to scroll both description and image items and it comes with previous, next, play, stop and mouseover events.
38. Simple JQuery Image Slide Show with Semi-Transparent Caption
a simple image slide show with a semi-transparent caption with jQuery. This example is suitable to display news headlines, or a image slide show in your website frontpage.
39. Sliding Boxes and Captions
Play around with animations of the sliding element to either show or cover up the viewing area, thus creating the sliding effect.
40. Animate Panning Slideshow with jQuery
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.
41. Fancy Image Gallery
42. jQuery Content Slider
43. Slick Auto Playing Content Slider
44. 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.
45. Highslide
Highslide JS is an image, media and gallery viewer written in JavaScript.
- Quick and elegant looking.
- No plugins like Flash or Java required.
- Popup blockers are no problem. The content opens within the active browser window.
- Single click. After opening the image or HTML popup, the user can scroll further down or leave the page without closing it.
- Lots of configuration options and scalability without compromizing on simplicity. A component system lets you strip away unused features down to a filesize of 10kB.
- Outstanding, unconditional and free user support for both commercial and non-commercial users.
- Compatibility and safe degrading. If the user has disabled JavaScript or is using an old browser, the browser redirects directly to the image itself or to a given HTML page.
- Source code included.
46. Kwicks
47.Resizable Image Grid with jQuery
Image grids that smoothly scale at the simple drag of a slider are no longer confined to desktop apps like iPhoto or Picasa. Thanks to some clever CSS and the jQuery UI, fluid image grids are now surprisingly simple to implement on the web.
48. Apple Style Slideshow
49. Gallerific
Galleriffic is a jQuery plugin that provides a rich, post-back free experience optimized to handle high volumes of photos.
50. S3 Slider : JQuery Image Gallery
S3 Slider is a jQuery plugin with nice effects and with self image changing.
51. Ultra versatile slider
An ultra versatile slider with horizontal scrolling and animated effects using MooTools.
52. jQuery Image Scroller
Image scrollers are of course nothing new; versions of them come out all the time. Many of them however are user-initiated; meaning that in order for the currently displayed content to change, the visitor must click a button or perform some other action. This scroller will be different in that it will be completely autonomous and will begin scrolling once the page loads.
53. Create Featured Content Slider Using jQuery UI
Showing off the best content of your website or blog in a nice intuitive way will surely catch more eyeballs. Using an auto-playing content slider is the one of techniques to show your featured content. It saves you space and makes for a better user experience, and if you add a pinch of eye candy to it, then there’s no looking back.
54. jQuery pageSlide
jQuery pageSlide was inspired by the UI work of Aza Raskin. In his recent posts regarding concepts for Firefox Mobile and a mouse-based Ubiquity, Aza introduced the idea of sliding (or “throwing”) content aside to reveal a secondary content pane.
55. Mootools Slider With Two Knobs
Ups…it is Moo tools… Well it is pretty cool though. You can very easily change the look and feel of the range indicator ( in blue in the above example), slider knob, the slider track by modifying the slider.css as required.
56. A Bullet-Proof Content Viewer
57. Fancy Sliding Form with jQuery
58. Simple iTunes-like Slider
59. jQuery Captify
Captify is a plugin for jQuery written by Brian Reavis (@brianreavis) to display simple, pretty image captions that appear on rollover. It has been tested on Firefox, Chrome, Safari, and the wretched Internet Explorer. Captify was inspired by ImageCaptions, another jQuery plugin for displaying captions like these.
60. CU3ER Image Slider
Yes it is Flash…but I though it is really cool and should be considered for a web design project where a image slider is needed. It is an image slider initially conceived to create 3D transitions between slides, turned out to be a convenient and multifunction solution that can be applied in a range of website building areas, from content slider to feature slider and image & banner rotator.