16 Free JavaScript Solutions for Displaying Your Images
If you’re looking for a way to display your images on a website but don’t have the time to create a custom solution, there’s plenty of free and easy-to-use scripts available at your disposal.
Here, I’ve compiled 16 free image galleries and slideshows for you to take a look at. Though the effects are smooth and their features are robust, none of them use Flash, only JavaScript, and they require very little coding on your part.
1. JonDesign’s SmoothGallery 2.0
SmoothGallery 2.0 is a nifty slideshow gallery that transitions between images very… smoothly. The author tested SmoothGallery 2.0 in Firefox, Opera, IE 6 and 7, and Safari. It requires the mootools JavaScript framework.
2. (E)2 Photo Gallery
(E)2 Photo Gallery is an open source photo gallery. The current version is still in beta but I’ve tested it to work with Firefox 2, IE 7, and Safari 3. What’s cool about (E)2 Photo Gallery is that the user can change the "skin" of the gallery. It uses the mootools framework and PHP for the photo uploader and image auto-detection features.
3. jQuery Gallery
jQuery Gallery is a plugin for the jQuery JavaScript library. It uses the Reflection.js script to add a reflection effect dynamically to your images.
4. MooPix
MooPix utilizes the Flickr API to dynamically populate your image gallery with pictures from a Flickr account without the need to use server-side scripting.
5. Highslide JS
Highslide JS is an open source script that uses modal windows instead of pop-up windows to open larger versions of the thumbnail images. It’s free for non-commercial uses.
6. Flickrshow
Flickrshow is another slideshow that allows you to access photosets, groups, and tags from Flickr. The current version has an improved caching feature which helps make the transition between images quicker and more fluid.
7. Galleria
Galleria is an image gallery that uses the jQuery library. It’s distributed under the GLP 3.0 License which permits you to modify and re-package the script (granted that you abide by the terms and conditions of the license).
Galleria demo 1 - Galleria demo 2
8. LightWindow v2.0
LightWindow 2.0 is an excellent choice for mixed media galleries because it also supports other file types such as Flash movies and video files.
9. easyALBUM
easyALBUM prides itself for being an image gallery that uses "super clean markup". It works well with CSS disabled and is compliant with current XHTML web-standards. It also allows the user to navigate through the gallery using keyboard shortcuts.
10. slideViewer
slideViewer is a plugin for jQuery and uses ordered lists for mark-up which is good for accessibility and with JavaScript turned off.
11. Image Transition Manager
Image Transition Manager provides you 8 transition effects. It was tested by the developer in Firefox 2, Opera, and IE 6 and 7. As an additional measure, I tried it in Safari 3 (and it works). It was developed using the script.aculo.us effects library which in turn requires the Prototype JS framework.
12. ThickBox
ThickBox is a script built on top of jQuery. It’s designed to display images as well as other types of document objects. It has the capability of loading content via Ajax requests.
13. ProtoFlow
ProtoFlow mimics the cover flow effect that you would find in iTunes, the iPhone, and other Apple products. In addition to the ProtoFlow JS and CSS file, it also uses three additional external JavaScript files - Prototype and script.aculo.us and Reflection.js - so make sure you’re willing to pay the price in page weight, additional HTTP requests, and potential decrease in page load times due to the above reasons.
14. Slideshow: A Javascript class for Mootools
Slideshow gives you tons of options and effects for your slideshow gallery. There’s a pan/zoom feature that makes for a very impressive transition between images, all entirely done using JavaScript. It doesn’t come pretty "out of the box", but with some simple CSS magic, it can looks awesome!
15. Javascript Image Gallery Using Mootools
This is a very simple image gallery, great for when you need something up right now. It doesn’t require you to know very much JavaScript to get it to work.
16. minishowcase
minishowcase gives you the ability to set the language used in your galleries, and it can be configured to detect the user’s language preferences. This image gallery uses PHP for the language selection and automatic thumbnail generation.
If you liked this article, you might also like "10 JavaScript Effects to Boost Your Website’s Fanciness Factor" and "40 Excellent Resources for JavaScript Coders".
26 Comments
Geovanny
May 4th, 2008
Nice article thanks
Massimiliano
May 5th, 2008
Very very good article. Thanks you!
Thomas
May 7th, 2008
A useful list of resources, thank you.
mikul gohil
May 9th, 2008
great jobs man good collection
Professional Website Design
May 14th, 2008
good work. thanks for sharing :)
Ahmed Sabbour
May 17th, 2008
I like this one..based on Prototype and Scriptaculous
http://www.nickstakenburg.com/projects/lightview/
Real Estate Graphic Design
May 22nd, 2008
But what about plain old lightbox?
rborn
July 1st, 2008
this is my script - mooZoom -
is not a gallery, but allows you to zoom images in the point desired using only mouse
http://www.rborn.info/products.php
hell
August 17th, 2008
Hmm Nice!
aaron
August 23rd, 2008
hi,
this is fantastic! love it!
a.
GuySurfing on Saturday Afternoon
November 8th, 2008
does anyone know of a slide show script that is like the dell.com home page? I’ve seen very similar home pages before, but I can’t remember them now. This script has the images and then the navigation is on the images, and as the images change, so does the navigation.
it’d be great if the navigation layer was slightly transparent so it wasn’t obtrusive to the image.
Hassan
January 12th, 2009
Wonderfully done. Congrats.
Aritra Sarkar
February 21st, 2009
Very Very nice and helpful.
Thank you.
Arun
February 24th, 2009
Thanks.. Nice work..
Kusal
March 15th, 2009
Thanks a lot, really appreciate this.
sunny
May 13th, 2009
Hi,
Thanks a lot for this,it is very helpful for me…
regards,
sunny
Brick
May 16th, 2009
Thanks for this, been looking for a nice simple gallery i can use to display a few pics and this works a treat. Cheers
Tole
June 3rd, 2009
Hi there,
Useful collection.
I also wrote a Javascript gallery which actually is not “one from the list”. It is something like “appendix to list” because it is iPhone optimized and it is meant to be used in combination with regular one.
The script is called Jaipho and you can check demo on http://www.jaiphodemo.info
Cheers
accounting homework
June 6th, 2009
Good one, galleries can be useful at times especially for projects etc
Thanks for posting them :)
Reiki
June 30th, 2009
Excellent information. Finding a few such solutions has taken hours in the past.
Thank u.
Leave a Comment