As a first example we take a look at the most basic implementation. We have a link that points to an image and we want to open the image in the lightbox:

<a href="image.png" title="my image" class="bblb">Image</a>

Now we have to bind the lightbox to the element:


The class "bblb" has no special meaning with the lightbox. We could select all link-elements and bind the lightbox to them, or any other valid jQuery-selector.


We recommend to append the binding of the lightbox at the end of the document, just before the closing </body>-tag.
If the scripts have to be added in the head of the document, please remember to use the ready-eventhandler from jQuery.

$( document ).ready(function() {
In either case be sure that the function is called after the "bb-lightbox.js" script is included.