Plugins

The plugins site is currently in development.

We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.

Slimbox 2, the ultimate lightweight Lightbox clone


Slimbox 2 is a 4 KB visual clone of the popular Lightbox 2 script by Lokesh Dhakar, written using the jQuery javascript library. It was designed to be very small, efficient, standards-friendly, fully customizable, more convenient and 100% compatible with the original Lightbox 2.

Slimbox 1 is one of the most popular scripts for the MooTools javascript framework, now Slimbox 2 provides exactly the same features set using jQuery.

Features

From a functional point of view, Slimbox 2 has the following added features compared to the original Lightbox:

  • Slimbox is ready to launch as soon as the document is ready. This means that you don’t have to wait for all images of the page to be loaded before clicking on a link that will launch the Lightbox effect.
  • Slimbox also centers images vertically on startup, not just horizontally. Vertical scrolling is still possible.
  • It works perfectly on horizontal-scrolling websites.
  • It temporary hides flash animations and other embedded videos while it is open to avoid display bugs in some browsers. It also hides select boxes in Internet Explorer 6.
  • Using a special option (“loop”), it allows you to navigate between the first and last images.
  • Slimbox is more responsive; it allows you to close it immediately at any time using the keyboard or mouse and to instantly navigate to any image before the current image has loaded or the animations are complete.
  • The script is more robust; for example you can try to start and stop Slimbox or navigate between images very quickly to interrupt the animations and resume them and you won’t notice any bug like in the original Lightbox where sometimes the animation stops or the elements are wrongly sized or positioned.
  • Slimbox can be launched from the traditional image links inside the page like the original Lightbox, but also directly from Javascript using its complete API.

From a design point of view, Slimbox 2 is very different from Lightbox:

  • The code is optimized to an insane level and has been written from scratch with efficiency in mind for the jQuery library instead of the huge Prototype/Scriptaculous. The script itself is as tiny as 4kb (minified, uncompressed).
  • Slimbox can be entirely customized thanks to many options. You can change the duration of any effect, the counter text translation or even the navigtation keys.
  • Slimbox has a much more powerful API, allowing you to apply the Lightbox effect easily on any clickable element or from any script. For example, it can be easily integrated with links pointing to Flickr or Picasa Web Albums pages or with any javascript image gallery.
  • The Slimbox CSS are simpler and 100% valid (no more CSS hacks). Also, every visual aspect of Slimbox (including images) is specified in the CSS instead of the Javascript so it is easier to style. You may even change any border size in the CSS and Slimbox will still work fine, which means that nothing is “hard-coded” in the source code.

Slimbox 2 is currently the smallest Lightbox-like script available for the jQuery library.

Compatibility

Slimbox 2 is compatible with all modern browsers: Firefox 2+, Internet Explorer 6+, Opera 9+ and Opera for Wii, Safari 3+, Camino and Google Chrome.

It works with both strict mode and quirks mode web pages.

Unlike many Lightbox-like scripts, it displays fine in case of horizontal scrolling of the web page.


4.666665
Your rating: None Average: 4.7 (6 votes)