In: , , , ,
On: 2008 / 04 / 03 Viewed: 89669 times
Shorter URL for this post: http://ozh.in/hd

Early 2006, a cool guy named Lokesh Dhakar introduced Lightbox, a unobtrusive script used to display large images using modal dialogs over a black faded background. A great script, really. Since, every once in a while, someone comes up with their own take at this concept, using this or that javascript library (jQuery, Prototype, Mootools, YUI, you name it) and supporting various types of objects: images, flash objects, videos, inline HTML content, iframes, content fetched via an Ajax call, etc

Recently, thinking about ditching Prototype here on this blog, I wondered if there was any cool Lightbox clone for jQuery. Man, there are dozens of them. How am I supposed to chose the one that will suit my needs? I started to write down a few URLs and comments, then it occurred to me that I could make something cooler. A few coding later, here is the Lightbox Clones Matrix!

Lightbox Clones Matrix

I've listed more than 30 scripts, detailing for each one:

  • Its javascript size (not considering CSS, images or anything else)
  • The library needed, if any, mentionning its javascript size. I opted to compare uncompressed javascript file sizes, as it (sorts of) reflects the complexity and/or power of the library, regardless of how packed/minified/obfuscated it usually ships.
  • The total javascript size. This data won't interest someone already using a javascript library on their site, obviously.
  • Image support
  • The ability to group images into a single collection, allowing for easily browsing through images within the same overlay
  • Any other common object supported: inline content (ie content already existing in the page, but typically hidden), iframe, content fetched by an Ajax call, video, Flash.

To make things cuter and quicker to read, everything is summarized by a row of pretty icons (mostly coming from the wonderful Silk set)

Lightbox Clones Matrix: the comparisons

Of course, what would be the point of it if you couldn't quickly restrict you search to a few criteria? There's a handy filter set to make your selection easier. All the options are logical "OR", ie selecting several features will list scripts with at least one of them. Note that you can shrink the filter box if you don't need it.

Lightbox Clones Matrix: filters

Overall I had some fun making the Lightbox Clones Matrix. I hope it will be actually of any use to someone. Bookmark it, just in case you need it in the future! ;)

Shorter URL

Want to share or tweet this post? Please use this short URL: http://ozh.in/hd

Metastuff

This entry "The Lightbox Clones Matrix: Compare 30+ Lightbox Scripts" was posted on 03/04/2008 at 5:46 pm and is tagged with , , , ,
Watch this discussion : Comments RSS 2.0.

104 Blablas

    Pages: « 1 [2] 3 » Show All

  1. 51
    byronius Canada »
    replied, on 11/Sep/08 at 12:34 am # :

    Hi Ozh,

    A new major version release of floatbox. Now does direct AJAX content, inline divs, flash, quicktime, youtube, yahoo video, etc., along with the usual image, gallery, slideshow and iframe suspects. A number of other useful features including international language localization.
    Code size = 71.3 KB (33.8 compressed, 105 fully commented).
    Thanks for keeping your list current.

  2. 52
    Ozh France »
    thought, on 11/Sep/08 at 12:43 am # :

    byronius » Thanks for letting me know, I've updated the list

  3. 53
    Jim Dabell United Kingdom »
    replied, on 25/Sep/08 at 5:40 pm # :

    nyroModal can handle Flash.

  4. 54
    diego valobra Italy »
    replied, on 12/Nov/08 at 2:19 pm # :

    Hi Ozh, i just finished my first plugin, take a look.

    http://www.pirolab.it/pirobox/

    Regards

    Diego Valobra

  5. 55
    diego valobra Italy »
    replied, on 21/Nov/08 at 3:28 pm # :

    Hi Ozh, have you seen my plugin??

    Regards

    Diego Valobra

  6. 56
    Pavel Jaros Czech Republic »
    wrote, on 01/Dec/08 at 3:58 pm # :

    Great tool, but I have found that my favorite ligthbox script called clearbox is missing. Check it at http://www.clearbox.hu/EN/

  7. 57
    Richard United States »
    wrote, on 10/Dec/08 at 10:58 pm # :

    Hey I just made a really light weight light box script called "lighter box" it is 7.9kb (total with all the files)
    (it doesn't require a library!)

    check it out and let me know what you think

    http://www.tdesignonline.com/lighter-box

    Blessings,
    Richard Lee

  8. 58
    Richard United States »
    commented, on 15/Dec/08 at 2:15 am # :

    I updated my lighter box to lighter box2 to incorporate some new features such as next and previous image, a transition effect, and a description display you can check it out here thanks for making this list its really cool to see other peoples light boxes!

    http://www.tdesignonline.com/lighter-box-2

    Blessings,
    Richard Lee

  9. 59
    Timo Germany »
    thought, on 19/Dec/08 at 10:25 pm # :

    Hello,

    EnlargeIt! finally made it to version 1.1. It can now also enlarge flash files, FLV videos, YouTube movies, DivX movies or iframes. Other new features: Navigation via arrow keys or mouse wheel, hidden call of a counter URL, border textures, smooth darkening. The script is now modular from 11 to 49 Kbyte. Integration has become easier than before. http://enlargeit.timos-welt.de

    regards
    Timo

  10. 60
    Arne Martin Aurlien Norway »
    wrote, on 08/Feb/09 at 5:14 pm # :

    So, hey, I've made one of these fancy image zoom scripts myself. I personally think it is pretty slick.

    It can be found at http://am.aurlien.net/projects/arnebox/

  11. 61
    Bert Ramakers Belgium »
    replied, on 25/Feb/09 at 6:27 pm # :

    Maybe you could add ImageZoom to the list?
    http://bertramakers.com/moolabs/imagezoom.php
    Thanks!

  12. 62
    Erdnuckel Germany »
    replied, on 14/Mar/09 at 12:08 am # :

    thanks for this list!
    maybe you would like to add fancybox http://fancy.klade.lv/home

  13. 63
    Jack United States »
    wrote, on 29/Apr/09 at 6:32 am # :

    Could you add ColorBox to this list? http://colorpowered.com/colorbox/

  14. 64
    Adeline Australia »
    replied, on 14/May/09 at 2:28 am # :

    This matrix is great and definitely useful! I'd be happy to find any lightbox that can play mp4 files? If anyone knows of any please let me know. :)

    http://twitter.com/adelineyaw

  15. 65
    Eduardo Argentina »
    replied, on 24/May/09 at 8:16 am # :

    SexyLightbox 2 rlz!

    http://www.coders.me/lang/en/web-html-js-css/javascript/sexy-lightbox-2

    Please update your matrix, because this new version can display inline elements, flash, iframes, and images.

  16. 66
    Thomas Germany »
    commented, on 24/May/09 at 10:28 pm # :

    Maybe you could add Anabox to the list: http://ix.residuum.org/anabox.html

  17. 67
    Boris United States »
    said, on 30/May/09 at 12:18 am # :

    Has anyone developed a combination: photo display with a scrollable text block stuck on the side?

  18. 68
    Eduardo Argentina »
    wrote, on 31/May/09 at 11:40 am # :

    Could you add SexyLightbox2 to the list?

    jQuery version:
    http://www.coders.me/ejemplos/sexy-lightbox-2/jQuery/

    mooTools version:
    http://www.coders.me/ejemplos/sexy-lightbox-2/

    Can display Images.
    Can display Gallery.
    Can display inline elements.
    Can display iframes.
    Can fetch content via AJAX.
    Can display flash.

  19. 69
    Tony Patrizi United States »
    said, on 18/Jun/09 at 9:41 pm # :

    I would love to be able to sort these by which ones are free for commercial use. Keep up the good work on this great resource!

  20. 70
    Ben United Kingdom »
    commented, on 05/Jul/09 at 12:14 am # :

    Just wondering if you could add Picbox?
    http://bunnyfire.co.uk/projects/picbox/

    Think the picasa image viewer but in a browser.. :)

  21. 71
    Jack United States »
    wrote, on 28/Jul/09 at 5:21 am # :

    Could you add ColorBox?
    http://colorpowered.com/colorbox/

  22. 72
    Ryan Huber United States »
    replied, on 13/Aug/09 at 12:15 am # :

    I was wondering when the last time this matrix was updated. Reason I ask is because I know a lot of the scripts have functionality like iframes which are not labeled in your matrix. For instance, pretty box, does not have iframes included in it's features.

    Thanks!

  23. 73
    Ozh France »
    said, on 13/Aug/09 at 8:40 am # :

    Ryan Huber » I'm obviously not reviewing every script regularly to check for updates.

  24. 74
    Frank Germany »
    said, on 23/Aug/09 at 11:09 am # :

    Guess you'd like to add this one here, as it supports PDF files, flv, swf, images and html: http://www.artviper.net/bumpbox.php

  25. 75
    Ozh France »
    thought, on 23/Aug/09 at 2:24 pm # :

    Frank » It's added. Thanks for your interest!

  26. 76
    Frank Germany »
    commented, on 23/Aug/09 at 4:11 pm # :

    Hi Ozh,

    thanks a lot! Keep up the good work!

    cheers
    Frank

  27. 77
    Jean France »
    commented, on 22/Sep/09 at 12:25 pm # :

    Could you add preloading and aut-resize to the available features ?

  28. 78
    Ozh France »
    commented, on 22/Sep/09 at 1:46 pm # :

    Jean » No. Simply don't want to review all the libraries again :)

  29. 79
    Paul Engel Netherlands »
    wrote, on 15/Oct/09 at 10:08 am # :

    Hi, there!

    Could you also add TopUp?
    http://gettopup.com/

    It's a Lightbox-like library. You can either host the JS and image files yourself or just use one(!) Javascript include, nothing more!

    It uses sprites to reduce the amount of image requests. It has a Apple-like Dashboard and Quicklook layout. Also, it offers you to keep your HTML code clean using CSS selectors.

  30. 80
    Ozh France »
    replied, on 16/Oct/09 at 9:22 am # :

    Paul Engel » Added. Thanks for your interest

  31. 81
    Gerg? Szabó Hungary »
    commented, on 16/Oct/09 at 3:59 pm # :

    Hi Ozh,

    I would like to recommend 2 Lightbox clones for you:
    - TinyBox JavaScript Popup Box
    - Clearbox 3

    It is a very useful list. Good work!

  32. 82
    Ryan Australia »
    said, on 22/Oct/09 at 7:15 pm # :

    The one that I would have to recommend is Simple Viewer. You can find it here

    http://topclonescripts.info/?p=169

    I use this on a bunch of sites, and their own CMS which is available as well. Cant recommend it highly enough, and it also looks amazing!

  33. 83
    Ozh France »
    commented, on 22/Oct/09 at 8:27 pm # :

    Ryan » totally off topic. This is Flash. This is obstrusive.

  34. 84
    artViper Germany »
    commented, on 01/Nov/09 at 2:16 pm # :

    Hi Ozh,

    bumpbox has been updated – using now some CSS3 styles, has a new media detection routine as well plays MP3 files now – seems you need to update your legend a bit to show this ^^

    all the best
    Frank

  35. 85
    Diego Valobra Italy »
    commented, on 11/Nov/09 at 7:27 pm # :

    Hi Hoz, i just released the new version of pirobox,
    http://www.pirolab.it/pirobox/
    Can you update the size of the script (11KB full version 8KB min version), it works with the latest jquery 1.3.2 that is 56KB so the total size goes from 64KB to 67KB.

    TNX aloT and regards,Diego

  36. 86
    Colin United States »
    commented, on 20/Nov/09 at 1:37 am # :

    Hi great list! Could you add my lightbox clone to your list? CeeBox. It has some functionality that others don't and I'd like to get it out there so others can use it if they need to.

    Name: CeeBox
    Framework: jQuery
    Size mimimized (but not gziped): 12KB
    Size unminimized (with all comments): 28KB
    Can display images: Yes
    Can group images into sets: Yes
    Can display inline elements: Yes
    Can display iframes: Yes
    Can fetch content via Ajax: Yes
    Can display Flash: Yes
    Can display various Video objects: Yes
    Other functionality: Can auto embed videos from youtube,facebook,metacafe, cnn, and a number of other video sites. Can display html and video in grouped gallery format along with images.

    Thanks!
    -Colin

  37. 87
    Ozh France »
    wrote, on 20/Nov/09 at 7:58 pm # :

    Colin » Done. Thanks for your interest.

  38. 88
    Paul Germany »
    wrote, on 03/Jan/10 at 7:19 pm # :

    A very useful list indeed. Thabnk you very much.

  39. 89
    Yury Russia »
    replied, on 18/Jan/10 at 8:23 pm # :

    Here is another one:
    http://www.plashenkov.com/2010/01/lightweight-image-viewer-for-your-site.html

    Please include it to your matrix if possible. Thank you!

  40. 90
    Ray Australia »
    wrote, on 24/Jan/10 at 4:53 pm # :

    G'day all,

    Great to see the web world so robust.

    Here is the $64 question – does ANY of these scripts work before the page has fully loaded?

    Cheers

  41. 91
    campuscodi Romania »
    commented, on 23/Feb/10 at 3:17 pm # :

    Here's another lightbox script for you: MooDialog

    http://mootools.net/forge/p/moodialog

  42. 92
    Someone unusual Germany »
    thought, on 06/May/10 at 7:45 pm # :

    There is another Lightbox-Clone called Quickbox, which is based on Slimbox an uses MooTools:

    http://andrewplummer.com/code/quickbox/

    As the main advantage over Slimbox, this script is a MooTools class and it's much easier to extend.

  43. 93
    Daniel Hungary »
    replied, on 22/May/10 at 8:38 pm # :

    http://www.clearbox.hu/index_en.html

    Clearbox is a professional image and content viewer overlay window. Images below are speaking for themself, where you can see some examples about using the script: image galleries and many type of contents including Flash, Quicktime, Windows Media formats, HTML, inner content, etc.

  44. 94
    Selina United Kingdom »
    wrote, on 22/Jun/10 at 3:34 pm # :

    Great list. Wish you could have put a tickbox column in however, to show which clones allow for image resizing within the browser window. I know prettyphoto does this but am not aware of any others -and for an image viewer this seems quite an important option to provide.

    Thanks tho – otherwise invaluable!

  45. 95
    mrag United States »
    thought, on 06/Jul/10 at 9:11 pm # :

    As of today, it seems the Weebbox site is not longer active. In addition, the script itself was acting up in Chrome although oddly enough, working well in FFx and even IE8.

  46. 96
    Alex Argentina »
    wrote, on 16/Mar/11 at 10:34 pm # :

    Wrote another one with browser back button support: http://mylittlehomepage.net/en/miscellaneous/mylightbox

  47. 97
    Ceramedia Netherlands »
    thought, on 11/Apr/11 at 1:49 pm # :

    We at Ceramedia created our own version of the Lightbox and called it Cerabox.

    It's build on MooTools 1.3, is 20KB in size and has all the features you are able to filter on at The Lightbox Clones Matrix.

    We would love to be included on the Clones Matrix and hope you like our version.

    More information available at http://cerabox.net
    The new website will be online soon.

  48. 98
    Ozh France »
    thought, on 11/Apr/11 at 9:09 pm # :

    Ceramedia » Added! Thanks for your interest

  49. 99
    Ceramedia Netherlands »
    said, on 27/Apr/11 at 2:02 pm # :

    With our latest release of CeraBox it's also possible to display "Inline elements".

    Also the new version of the website is live with examples and options.

  50. 100
    nyro France »
    wrote, on 29/Jun/11 at 2:07 pm # :

    First of all, thanks for this great tool.
    I'm the creator of nyroModal, and with the version 2, nyroModal can display flash and various video elements.
    Actually, it uses embed.ly API, so it supports a LOTS of video and image websites…

Pages: « 1 [2] 3 » Show All

Leave a Reply

Comment Guidelines or Die

  • HTML: You can use these tags: <a href=""> <em> <i> <b> <strong> <blockquote>
  • Posting code: Post raw code (no <> &lt; etc) within appropriate tags : [php][/php], [css][/css], [html][/html], [js][/js], [sql][/sql], [xml][/xml], or generic [code][code]
  • Gravatars: Curious about the little images next to each commenter's name ? Go to Gravatar.
  • Spam: Various spam plugins on patrol. I'll put pins in a Voodoo doll if you spam me.
  • I will mark as Spam test comments, all comments with SEO names (ie "My Cool Online Shop" instead of "Joe") or containing forum-like signatures.

Read more ?