Using LightBox in ASP.NET master pages

Question

I am using LightBox v2.0.4 with master pages on a web site and am having problems with the loading.gif and closelabel.gif images appearing. I have content pages residing in folders that are 3 layers in from the root, their master page is 2 layers in from root, images in question are in ~/images/, and the javascript files are in ~/js/. e.g.:

~/categories/category/subcategory/contentpage.aspx
~/categories/master.aspx
~/images/loading.gif
~/images/closelabel.gif

I have tried changing the path to the images in the lightbox.js script file to ~/images/loading.gif and ~/images/closelabel.gif, but that didn't work. I have been digging around the 'net via Google and haven't found any answers ... does anyone here know what the problem is?

Wayne

Answer 1

You can't use ~/images...etc in the .js files. You have to use the path relative to your .js file location.

Answer 2

Check the paths to these two files in the lightbox.js file:

//
//  Configuration
//
var fileLoadingImage = "images/loading.gif";        
var fileBottomNavCloseImage = "images/closelabel.gif";

And make sure that the master page is referencing the js files correctly - last time I got this correct in the master page, VS was showing the red squiglies, but it was working :-)

Answer 3

try referencing these images by full path from the domain root starting with / (e.g. '/images/loading.gif') without ~ but with starting slash.