A while back, I posted that I was working on another side project. One the cool things features of this website project is the use of the Lightbox JS script used to overlay images on the current page. I told Nick about me adding this to the site to make the pictures “cooler.” One of the first things Nick mention was that I had turned off the key-press events for navigating the pictures through a slide show. I was first confused by his comment since I've done nothing to change the Lightbox script. Well, it turned out that he thought I was using Lightbox JS v2.0. After looking at version 2.0, I was blown away by the coolness. I had to incorporate this version into the site. But how? Alas, LightBox.NET for ASP.NET 2.0.
LightBox.NET is nothing more than my packaging of Lightbox JS v2.0 into a .NET assembly along with two simple web controls to provide the “lightbox” support. The first web control, ScriptManager (thanks Atlas!), is used to install (creates a directory and related files) the necessary script, image and CSS files into your ASP.NET application and to add the correct HTML elements to your element. If you want to use LightBox.NET in your page, you need to place a ScriptManager control in it. The syntax is something like this:
<lbn:scriptmanager runat="server" id="imgManager" />
From here, you can now use the Hyperlink web control to render out your "lightboxed" image by setting the imageurl and navigateurl properties. If you want to take advantage of the image set feature the script offers, you will only need to specify the group property of the control. The syntax is something like this:
<lbn:hyperlink id="img1" runat="server" imageurl="images/thumb-1.jpg" navigateurl="images/image-1.jpg" tooltip="Picture 1" />
For more information and examples on how to use LightBox.NET, check out the included client. You can download LightBox.NET from here. Check it out and tell me what you guys think. To see it in action check out http://dominiclozano.com/photos.aspx.