The original Lightbox script, by Lokhesh Dhakar, is now updated and called Lightbox 2. The web page has good examples of its use. This script is only for images and image sets, so I did not investigate it further. The display seems very clean and elegant. Like many, though not all, of these toolkits, it uses some third-party JS libraries (the Prototype framework and the Scriptaculous library). It doubtless makes a lot of sense to leverage these toolkits, but it also means sending more code to the browser and can get complex if you’re integrating into a framework like Confluence.
As I said, a number of these scripts are images-only. I wanted to pop up an entirely separate web page in the box. So I moved on, to Cody Lindley’s Thickbox. This script can display ANY sort of content in the popup. There’s lots to like here in terms of functionality. I ultimately decided not to use it for two reasons: firstly, the CSS appeared to have a bad effect on my Confluence site CSS (though later investigation suggests I may just have needed to restart Confluence), and the typography, styling and display were not quite as slick as some of the others. In fairness, the author makes it plain that he created the script as a proof of concept, and it is readily amenable to tweaking, polishing, etc. The basic functionality seems very sound. Thickbox also uses an additional JS library, in this case the also-very-popular jquery.
Slimbox, by Christophe Beyls, bills itself as a more efficient (hey, when it did become the style to write that as “more-efficient”? That drives me nuts) Lightbox clone. Like Lightbox, it is images-only. It uses jQuery instead of Prototype and Scriptaculous. It claims to be heavily optimized and a good bit faster. Clicking through the examples lends some credence to this, but many factors could play into that. Like other scripts, this one is well documented and free.
The script I finally settled on (and believe me there were many more I did not get to looking at) is called Lytebox, by Markus Hay. Lytebox ultimately filled the bill for me for the following reasons:
- Not limited to images
- Entirely self-contained JS and CSS, does not require inclusion of entire libraries, which could further bloat the already sizable JS/CSS payload coming down from Confluence.
- Nice-looking design
I dropped Lytebox into my Confluence install (ok, to be more accurate, I dropped it in via the all-important Theme Builder plugin I use to customize Confluence CSS and JS) and it Just Worked.