Lightbox, Leightbox and my improved Leightbox

For my latest project I wanted to include a nifty 'Lightbox effect'. The original Lightbox effect however is limited to displaying images and I wanted to show HTML.. So I searched the net and came across Leightbox. Leightbox is a modification to Lightbox which allows you to easily display a piece of HTML (a DOM node actually) using a lightbox effect..

The problem with Lightbox however is the way it binds itself to click events.. You can only load a Leightbox using a click event.. I wanted to have a Leightbox appear using a timer, so I looking into the source and came up with the following:

1) change the initialize function inside the lightbox.prototype to:

initialize: function(ctrl) {
if(ctrl) {
    this.content = ctrl.rel;
    Event.observe(ctrl, 'click', this.activate.bindAsEventListener(this), false);
    ctrl.onclick = function(){return false;};
}
},

What this does is check if the 'ctrl' variable is actually passed.. If it isn't, the function does nothing..

2) Add a new function:

initCallable: function(rel) {
this.content = rel;
},

3) You can now manually load up your Leightbox of choice by calling the following:
lb = new lightbox();
lb.initCallable('idOfDiv');
lb.activate();

Update: this technique is no longer valid or neccesary in the current Leightbox version.

New instructions:

1) Leave the lightbox.js (from leightbox) unmodified (download the latest version at: http://eight.nl/files/leightbox/)

2) Remove the class="lbOn" from your lightbox activating links

3) Create a javascript var (outside a function):

var myLightbox;

[4) Use an intialization function (i.e. body onload="initFunction"):

myLightbox = new lightbox($("IDOfActivationLink"));

(Don't forget to set the rel property of the link to the DIV's id you want to show (like you normally would with Leightbox))]

You can now use myLightbox.activate() and myLightbox.deactivate() to turn on/off the lightbox.