ThickBox 2.0, Running on jQuery

Posted on by

ThickBox, a Lightbox-like modal window framework for the browser written by Cody Lindley that runs on top of the jQuery library, has been given a bit of an upgrade. The new 2.0 release adds greybox functionality (iFramed content), image set support (similar to the Lightbox 2.0 functionality), and is now running on jQuery 1.0 among other things.

You might be asking yourself:

“Why wouldn’t I just use Lightbox 2.0 if ThickBox 2.0 does the same thing?”

The answer is simple. Uncompressed, the jQuery library and the ThickBox add-on script come in at only 51kb (and at just 27kb if jQuery is compressed), whereas the Lightbox Javascript files alone are over 100kb combined. Think about the amount of bandwidth saved and the increased loading time for the end user.

Won’t someone please think of the children end user?

Another advantage that ThickBox has over Lightbox is that images are automatically resized if the browser window is too small to display them full size without scrolling. Also, clicking outside of the modal window closes it in ThickBox, whereas in Lightbox, a “close” button must be clicked to remove it from the screen.

Visit the ThickBox demo site for instructions on installation, demos of different techniques (including iFramed content and AJAX content), and support information.

Currently supported and tested browsers include Internet Explorer 6 and 7, Firefox 1.5+ on both OS X and Windows, Opera 9+ and Safari 1.3.2 and 2.0.3., though it should work on any modern browser. ThickBox is protected by the MIT License.

6 thoughts on “ThickBox 2.0, Running on jQuery”

  1. Patrick Haney on said:

    Good point Wesley. I’ve edited the post just a little to reflect that uncompressed, we’re talking about a 50kb+ difference between ThickBox and Lightbox. That’s probably a better comparison, especially since I’m not sure what the Lightbox files would be if they were compressed.

    Still, ThickBox comes in at half the file size even when it’s uncompressed, and that’s impressive.

  3. Cody Lindley on said:

    Nate, I am sorry…I did forgot. I need to give you credit on the site for the loading animation graphic. I’ll fix that tonight. My bad!

  4. Dan Atkinson on said:

    You didn’t mention the ability to display HTML in thickbox, which is one of the other huge advantages over Lightbox.

  5. Patrick Haney on said:

    Dan: Good call, I forgot that Lightbox couldn’t do that. I’ve been using ThickBox for so long, I didn’t even consider that.

    Luna: The current stable version of jQuery is not at 1.0 yet, as I believe the 1.0 release is in alpha stages (you’d have to ask John though). But there was some new functionality that Cody wanted to use and 1.0 was the best way to do that.

  6. Patrick Haney on said:

    Steven: in most cases, the compressed Javascript would be used, unless the developer(s) wanted to be able to make changes to it periodically. I use the comparison of the uncompressed file sizes because I don’t know what Lightbox 2.0 is when it’s compressed.