“Spry”:http://labs.adobe.com/technologies/spry/home.html is a great Ajax library and is pretty easy to use but seeing as you do not have the images in the html at the time of rendering in the browser “Lightbox”:http://www.huddletogether.com/projects/lightbox2/ doesn’t have access to the current _a_ and _area_ tags in the page. So…what’s the solution?

Well, there are other ways you can make this happen but here is one:

bq. Spry.Utils.addLoadListener(function() { setTimeout(function() { myLightbox.updateImageList(); }, 1000); });

Basically add a listener so when the data is loaded simply tell _myLightbox_ to update the image list (which is the function that parses the DOM) after 1 second (1000 milliseconds), just to give Spry enough time to render the html. _myLightbox_ is the instance name Lightbox.js creates for the Lightbox instance.

Feel free to explore other ways for adding listeners/observers to Spry and post them. I didn’t find much in Google so I figured I’d post my quick fix.