Adding Dojo Lightbox to an XPage

I saw that Niklas Heidloff added my little Bildr project to a presentation on YouTube so I was somehow forced to apply  some fixes.  Since most XPages projects on OpenNTF use the OneUI interface I thought it would be benefitial if I would apply the same UI to my project so this is what I am working on at the moment.

The subject of this post sounds a bit mis-leading because the first step to achieve this is not so hard to achieve. Just read it here in the XPages wiki from YouAtNotes.

Use dojox lightbox

The dojox package contains a lightbox to nicely show an photo.
Basic usage: include the dojox.image.Lightbox module in your XPage, set “dojoParseOnLoad” and “dojoTheme” to “true” and add HTML like this:

<a href="bigimage.jpg" dojoType="dojox.image.Lightbox"><img src="smallimage.jpg"></a>

with “bigimage.jpg” as the full sized version of your photo, and “smallimage.jpg” as the thumbnail.

Important: for whatever reason a CSS file is NOT automatically included, so the lightbox will not work as expected. You have to localize the “lightbox.css” and add it to your XPage manually.

My question is not how to apply the dojo module to an xpage but more: how to apply the lightbox stylesheet?

Advertisements

3 thoughts on “Adding Dojo Lightbox to an XPage

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s