There are many solutions like Lightbox, to display the pop-up block (modal windows, overlays) of single images, web image galleries, videos and other media and content formats on your websites. Internet users loves the “lightbox” effect. It looks cool and stylish. You should use it, if you are working on new web design project.
This is a list of Top 33 jQuery, Mootools, Prototype Lightbox Scripts for displaying galleries and images in overlay pop-up boxes.
1. Awesome Box JavaScript gallery
With Internet Explorer 6 support. Key navigation using “n” for next, “p” for previous and “x” for close.
2. Bumpbox 2.0 Mootools lightbox clone
Bumpbox 2.0 – a lightbox clone with support of PDF, flv, swf, audio, images, inline HTML and remote html files. Useful script for web design.
3. jsImageBox
Compact and easy-to-use script that allows you to show enlarged images in the pop-up boxes. Website is in Russian language :(.
4. ColorBox lightbox jQuery plugin
A light-weight, customizable lightbox plugin for jQuery 1.3, 1.4, and 1.5. This plugin is realized in five different styles. Click on the “Examples” links from 1 to 5 to see all styles in action. Supports photos, grouping, slideshow, ajax, inline, and iframed content.
5. Control.Modal windowing toolkit for Prototype
Control.Window is a fully programmable, multi purpose windowing toolkit for Prototype.
6. EnlargeIt! JavaScript gallery
Easy-to-use, can work with pictures, flash, FLV, YouTube, DivX and iframes.
7. Facebox jQuery Facebook-style lightbox
Easy-to-use, Facebook-style lightbox plugin which can display images, divs, or entire remote pages for your web design.
8. FancyZoom JavaScript plugin
Smooth Javascript image zooming plugin for your websites, lightbox alternative.
9. FancyZoom with using the jQuery library
This lightbox plugin works with any images, text, headings and flash.
10. FancyBox gallery – jQuery lightbox alternative
FancyBox is a jQuery library based tool for displaying images, image galleries, html, SWF movies, Iframes and Ajax requests in a Mac OS-style “lightbox”.
11. Floatbox JavaScript lightbox gallery
Floatbox is a JavaScript plugin for displaying windowed content (pop-up lightbox) over top of web pages. This gallery works in all major browsers.
12. GreyBox
GreyBox can be used to display websites, images (and galleries) and other content in a pop-up window.
13. Highslide JS JavaScript thumbnail viewer
Highslide JS is an image, media and gallery viewer written in JavaScript.
14. ImageZoom Mootools plugin
It is based on LightBox JS. ImageZoom is perfect tool for photo online galleries. It can display large images on top of a page, and has the ability to group multiple photos in one set.
15. jQuery lightBox plugin
lightBox plugin is used to overlay images on the current page. It is easy-to-use, easy to install and looks elegant, simple and awesome on every web designed page.
16. Leightbox plugin, Prototype based
Plugin for displaying content in modal windows.
17. Lightbox+
Inspired by Lightbox JS gallery script. Main feature: the image is resizing automatically to fit your window size.
18. LightBox2 gallery plugin
Simple image gallery script used to overlay images or sets of images on the current page. LightBox2 works in all modern browsers. It is using Prototype JavaScript library.
19. Lighter Box2 lightbox script
This is really light weight lightbox script for your website images and galleries. New optimized version works with Chrome 5,6; Firefox 3; IE 7,8,9; Opera 10 and Safari 4,5.
20. TopUp javascript lightbox
TopUp is an easy to use Javascript jQuery based library for showing images and webpages in a Web 2.0 style (lightbox-like). Supported media: images, flash (Youtube, SWF and FLV files), movies (QuickTime, Windows Media and Realplayer), iframes, DOM elements and raw HTML.
21. LightWindow v2.0 lightbox plugin
Yet another, but very functional Prototype + Scriptaculous plugin, modal window, lightbox, slimbox or whatever… Tested in Windows Firefox/IE6/IE7/Safari3/Opera & Mac Firefox/Safari/Opera/Netscap. Supports different type pf Media and renders it appropriately.
22. LiteBox Mootools plugin
It is a modified version of Lightbox v2.0.
23. LyteBox plugin
Lytebox is another javascript with lightbox effect. It was was written from the Lightbox class. It supports slideshows, themes, HTML content and images.
24. Milkbox Mootools plugin
Just another lightbox clone for Mootools 1.2.x. Main features are: swf support, AutoSize and maxHeihgt options, AutoPlay, XML Galleries, etc. Milkbox v3.0 will be released soon and it will be based on Mootools 1.3.
25. piroBox jQuery plugin
piroBox is jQuery based plugin which can open all kind of files: inLine content, swf, images, PDF. Features: auto image resizing, drag and drop. Works with FireFox 2+, Opera 9.5+, Chrome, Safari (Mac/Windows), IE 7+.
26. PrettyPhoto jQuery based plugin
prettyPhoto is a jQuery based lightbox clone (for opening images in overlay windows). Support images, videos, YouTube, iFrames. Works with all browsers, even with IE6.
27. Sexy Lightbox Mootools plugin
Really sexy clone of lightbox based on Mootools.
28. ShadowBox media viewer
Shadowbox is a web-based JavaScript media viewer application that supports many different media formats (images, image galleries, QuickTime, Windows Media Player, Flash, Flash video, HTML, and even external web pages). Works with IE6+, Firefox 1.5+, Safari 2+, Chrome, Opera 9+.
29. SlideWindow image viewer plugin
SlideWindow — A Lightweight Image Viewer For Your Website. Works with IE (6+), Firefox, Opera and Chrome.
30. Slightly ThickerBox 1.7
Slightly ThickerBox is a modification of Thickbox script. It can be used for creation of image galleries.
31. Slimbox Mootools plugin
32. Suckerfish HoverLightbox Redux Prototype plugin
33. ThickBox
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. It is outdated now.
Demo and DownloadThis was a big one If you have any other lightbox clone scripts – use my comment form 😉
Wow, I never knew there were so many options!
These are beautiful and I’ll definitely be playing around with them. Really useful article. On a related subject does anyone know what script to use, and where to put it, for applying a permanent cookie to pop ups? I use jquery pop ups occasionally on my homepage but really want to restrict them to come up once per user rather than per session. Anybody got any ideas?
Here you have comparsion of 57 lightbox clones…
http://planetozh.com/projects/lightbox-clones/
Cheers!
thanks )
Bumpbox 2.0 is really awesome, thanks!
One of my favorite )
nice collection….
thanks for your time
You are welcome )
Pretty comprehensive
Bookmarked.
Thanks Alex
i suggest this incredible plugin:
http://www.yoxigen.com/yoxview/
awesome!
These are some excellent resources! Thanks for sharing.
Hi,
Here is a jquery lightbox, it’s same Multibox on Mootools, this is useful for people who love Multibox but don’t family with Mootool.
Very Good Collection. . .
Very nice collections, all are really cool, I like jQuery and prototype most. thanks!
i can’t understand how they work all of these on blogger.I try to learn,learn and again learn but nothing.can you help me with a tutorial for noobs to make them work in blogger?
Thanks and sorry.
Great artcile.I love this plugin.
I have fun with, cause I found exactly what I used to be having a look for. You’ve ended my 4 day long hunt! God Bless you man. Have a nice day. Bye
Hi,
I’m having troubles implementing SlideWindow in IE9. In this demo, and in one website I’m workin’ on, it shows correctly only the first photo. The second will always jump to the right (the left border of the slideWindow is in the middle of the browser, so not centered) and it’s width gets shortened. Thinking about some differences (like always) in processing of CSS styles between IE9 and other browser, which are all ok with slideWindow. Could you help me, please?
Thank you.
Olda, Czech republic
Solved! There are 2 problems in reloadImg(). First is passsing 2 parameters to function setWndSize in imgMain.onload = function() construction, where IE9 don’t know width and height parameters of object before appending into imgArea. Better choice is passing naturalWidth and naturalHeight, so: setWndSize(this.naturalWidth, this.naturalHeight);
Second problem is, that when new src is set to image object, IE9 automaticly adds width and height parameters. But when you change src of this object, IE9 leave previous values of width and height, so it has to be changed (or deleted) manually, like this:
imgMain.src = ”;
imgMain.removeAttribute(‘width’);
imgMain.removeAttribute(‘height’);
imgMain.src = images[index];
Hope, this will help to the others.
Cheers
Thanks!! Bumpbox 2.0 Mootools lightbox clone was exactly what I was looking for =)
I simply could not depart your website before suggesting that I extremely enjoyed the standard info a person supply for your visitors? Is gonna be again steadily in order to investigate cross-check new posts
thanks dude!!!!! really very very helpful
Any ideas for a Pdf Web gallery ?
Nice Collection
thanks allot for these scripts, they were really helpful
all are really cool, I like jQuery and prototype most. thanks!
What a wonderful discovery of lightbox scripts. Thanks for the share!
Thank you, you saved my life..
hi
i need to light box to add to my web site
It Very nice, I need a template that it should a image and description about it in the right side. please help. thanks in advance