15 Free and Easy to Use JavaScript Solutions for Displaying Your Images

Displaying images creatively is always a challenge for web designers. You have to consider, the usability, creativity, ease of use, and so many more factors. In which case, the most probable solution that comes to mind is a custom script. But that is not always the most efficient solution. There are tons of free and easy to use scripts available which allows you to display your images smoothly.

In this post, You will see 15 Free Image Galleries and Slideshows which are powered only by JavaScript. Yes Thats right, no Flash which makes these scripts better for usability as alot of users don’t use flash as well as these speeds up your load time compared to the flash scripts. Despite the fact that these scripts lack Flash, the effects and features are both great and it works smoothly. These scripts are very easy to use and requires very little on your part.

Why Consider a JavaScript Solution instead of Flash Solution?

When you want to showcase your products, portfolio, or other images, you don’t want to limit your audience. When you use flash solutions, you restrict your showcase to the users who have Flash enabled. Using a Flash based solution will make your site less Search Engine friendly as most flash solutions does not provide text files for Search Engines. Which means Search Engine bots won’t see your content or links therefore you won’t be getting the full exposure. So I recommend you use JavaScript solutions. Enjoy the collection.

1. Mini Showcase

Mini Showcase is a small and simple javascript online photo gallery which is powered by AJAX that lets you display your images without having to configure databases. Mini Showcase 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. Open for customizations if you desire, but not required.

2. Slideshow 2 – Javascript Class for Mootools 1.2

Slideshow 2! is a javascript class for Mootools 1.2 to stream and animate the presentation of images on your website. It gives you tons of options and effects for your slideshow gallery. It is easy to manage and insane possibilities to make it look however you want. Different sliding options just rock in this script.

3. ThickBox 3.1

ThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. Its function is to show a single image, multiple images, inline content, iframed content, or content served through AJAX in a hybrid modal.

4. JonDesign’s Smooth Gallery 2.1

Unlike other systems out there, JonDesign’s SmoothGallery is designed from the ground up to be standard compliant: You can feed it from any document, using custom css selectors. And even better, this solutions is very lightweight: The javascript file is only 24kb. The author has tested this script into Firefox, Opera, IE 6 and 7, as well as Safari.

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. This gives an advantage compared to other options because it bypasses the pop-up blocker problem. Lots of configuration options and scalability without compromizing on simplicity. It’s free for non-commercial uses.

6. LightWindow 2.0

LightWindow 2.0 is an excellent choice for multipe media galleries because it supports other file types aside from images such as Flash movies and video files.

7. Ajaxorized – 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.

8. 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.

9. 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.

10. E(2) Photo Gallery

(E)2 Photo Gallery is a open source gallery built with Mootools Javascript Library the compact, modular, Object-Oriented javascript framework. Designed to allow you to upload your photos to a desired folder, tell the (E)2 Photo Gallery what folder to look at and it will automatically load the images using PHP. Some of the cool features of E2 Photo Gallery is that it lets you change the viewer’s design. It also automatically adjusts the image sizes. Tons of other features as well.

11. JavaScript Image Gallery Using Mootools

It is a very simple image gallery. Very simple to set it up, great for when you need something up right now. Doesn’t require you to know alot either.

12. jQuery Slide Viewer 1.1

slideViewer is a plugin for jQuery and uses ordered lists for mark-up which is good for accessibility and with JavaScript turned off.

13. Flickrshow

Flickrshow is another slideshow that allows you to access photosets, groups, and tags from Flickr. It has an improved caching feature which helps make the transition between images quicker and more fluid.

14. easyALBUM

easyALBUM works well with CSS disabled and is compliant with current XHTML web-standards. It allows the user to navigate through the gallery using keyboard shortcuts.

15. ProtoFlow

ProtoFlow imitates the cover flow effect that you would find in iTunes, and other Apple products. It uses three additional external JavaScript files which makes it heavier on the server, and potential decrease in page load times due to the above reason.

These are just a few options that I thought deserved the mention. I am sure there are other ways out there. So next time when you want to display your image in a gallery or a slideshow don’t go for a custom option. There are easier solutions available for you.

If you like this post please digg, retweet, stumble, and just spread the words around. Don’t forget to follow me on twitter @syedbalkhi.