Caption to photos - spry gallery

Question

hello
i am trying to replicate the functionaly / effects given at this link http://labs.adobe.com/technologies/spry/demos/gallery_pe/dynamic/index.html
I wish to add caption to the photos which i handle via XML. Can anyone help me in putting caption / title to the photos
regards
ssg

Answer 1

Hi,
I have captions and images via Spry XML datasets at the following page http://www.thehmc.co.uk/photos.asp
Try changing the example structure
div id="picture">
<div id="mainImageOutline"><img id="mainImage" alt="main image" src=""/></div>
</div>
To
<div id="picture">
<div id="mainImageOutline"><ul><li><img id="mainImage" alt="main image" src=""/>{caption}</li></ul></div>
</div>
Looks like the javascript file gallery_xds.js must be dynamically changing the
src attribute of the image via CSS selectors via Spry.$$ or some such. So it will need to
dynamically change the content of the li tag to include your captions.
Here's an extract of the CSS I use to style my gallery
/* This is for the photos page */
.photoTitles {
     display:block;
     clear: both;
     width: 840px;
.Gallery {
     list-style:none;
.Gallery li {
     float:left;
     width:240px;
     height: 290px;
     margin-bottom:5px;
     margin-left: 15px;
     color:#000;
     background:#CC3;
     text-align: center;
     font-style: italic;
     font-weight:600;
.Gallery img {
     display:block;
     width:220px;
     height:220px;     border: 10px solid #FFF;     }
Doesn't have the nice animation of the Adobe Spry example but you should be able to adapt the structure to fit your needs.
Cheers
Phil