10 Awesome jQuery Image Galleries and Sliders
One of the most common requests I get from clients is to have some sort of image gallery on their site. Whether it’s a sliding image gallery on a homepage displaying promotions or a robust gallery full of portfolio images showing off the quality of work, jQuery image galleries are a great way for displaying multiple images on a website. They are search engine friendly, iPad and iPhone friendly, and lighter weight than a lot of the Flash slideshow galleries on the market.
Camera slideshow is a jQuery plugin, that can also be used as a WordPress plugin. It has 33 built-in themes and has a CSS file included for further customization. Implementing the Camera Slideshow plugin is quite easy – at least the basic configuration. All you need to do is include the following code (just as an example) in your website files:
This jQuery slider also has 30+ skins so you have many options for customizing your slider layout. You can also customize almost every other option and sliding effect including opacity, alignment and much more.
Polaroid Photo Viewer is an outside-of-the-box kind image gallery concept. You’re able to move images all over the page, bring them to the front, and rotate them. This concept might not be the best on a professional site, or one with lots of images, but it certainly is fun and a unique spin on standard image galleries. Click here if you’d like to download the source code files. Also, check out the tutorial here.
Cycle takes a rather interesting approach on how to display images. Rather than the standard slider, or gallery with thumbnails, their transitions give their photo browsing experience and almost human-like interaction. The shuffle effect is like shuffling through a stack of photos in your hand, while others like zoom or scroll. Reminds me of viewing photos on an iPad or iPhone.
Transition Slider is a very flexible and easy to use Image transition slider plugin for JQuery.
PrettyPhoto is another lightbox style image gallery that will overlay your images on top of the current page. One of the nice things about PrettyPhoto is that it adds in social links so viewers can easily like or tweet a photo. As if that wasn’t cool enough, it was also built to handle videos, Flash media, YouTube, iFrames, and Ajax!
VisualLightBox is a free wizard jQuery program that helps you create photo galleries.
S3Slideris a great option for an image slider to help spruce up a homepage. It has a clean, simple, and sleek look that allows you to easily add a bit of text along with your image. You can easily manipulate the S3Slider to take on various shapes, transitions, and even have your text displayed in different positions.
FancyMoves is a jQuery image slider that operates similarly to the Cover Flow song browsing option in iTunes. The central image is the largest, while the ones entering and leaving the screen shrink in size to give the transition an almost 3D effect. Modifying the slider width and how much of the next and last image to show is a breeze, you can feature multiple FancyMoves sliders on a page, and the last image loops back to the first image.
About the author: with over ten years in the freelance web design and writing fields, Scott Stanton has had his finger on the beating pulse of the industry’s hottest design trends and bends for the past decade. Scott regularly writes for Wix.com the free website builder. Follow him on Twitter @TheScottStanton.
You may also like:
- 10 Amazing Responsive Image Galleries
- 10 Awesome jQuery Tutorials
- 10 Awesome jQuery and HTML5 Audio Players
- 10 Inspiring Thumbnail Galleries
- Top 10 Web Design Galleries for Your Inspiration
- How to Put Your Image in List Item with CSS
- 36 Image Hover Effects Made with CSS3
- Display icons using a single image and CSS “Sprites”
- Top 20 Best jQuery Carousel Plugins
- 20 Best Premium and Free Image Hover Effect Plugins
Subscribe to our RSS feed!
Popular on Web Design Dev:
- Free Wix Website Templates
- 20+ Portfolio Website Templates for Architects
- 20+ Portfolio Website Templates for Artists
- Creative Resume Templates for Web Designers
- Web Safe Fonts with CSS
- Best Free Tumblr Themes
- 20+ Free HTML Templates
- Professional Free Bootstrap Themes
- Best Shopify Themes for High Conversions
- 20+ Events Production Website Templates