Home » News » Litebox: Lightbox Functionalit ...

News by JavaScriptSearch


Litebox: Lightbox Functionality in Half the Size

 

JavaScriptSearch
Tuesday, July 4, 2006; 06:05 AM

So far we've had Lightbox, Thickbox, and LITbox: all of them simple JavaScript solutions to the timeless problem of displaying pictures on websites in a snazzier way.  Now a new, moo.fx-based libray is joining the ranks of Lightbox clones.


Like its admittedly bulkier predecessors Litebox was conceived as the pet project of a single web developer -- in this case, Tyler Mulligan, a 21 year old Computer Networking major from Connecticut.

Here is how the author describes the project:

"Litebox is a modified version of Lightbox v2.0 created with one thing in mind, size reduction. Litebox utilizes the 3kb javascript library moo.fx in association with prototype.lite, giving us the basic tools we need to make this work and you the ability to expand."

Using Litebox should not be a challenge for anyone.  The following code goes in the <head> section:

<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

<script type="text/javascript" src="js/prototype.lite.js"></script>

<script type="text/javascript" src="js/litebox-1.0.js"></script>

And the <body> section of the HTML document has to contain links like this: 

<a href="images/image-1.jpg" rel="lightbox[example]" title="Horses"><img src="images/thumb-1.jpg" width="100" height="40" alt="Beautiful Horses" /></a> 

Litebox is available for download at http://www.doknowevil.net/litebox/.  The JavaScript code is around 25KB in size, less than half of Lightbox's 55KB (with Prototype Lite).  

 

Advertisement

Partners

Related Resources

Other Resources

arrow