Text out of sync with fadeslideshow

Text out of sync with fadeslideshow

My question is twofold.  I have a jQuery fadeslideshow which displays a caption along with the image.

P1. I cannot seem to get the text to display below the image.  Anytime I attempt to do so, it is clipped.  I know it is getting clipped because I have padded it down to the bottom of the image to where it actually clipped. It seems anything I move outside of the height/width of the slideshow is clipped, except the control buttons which are absolute positioned.

Q1: How d I display text outside of the bounds of the slideshow?

P2. The text that I am displaying, over the image, is being treated by the slideshow like a separate element.  i.e. The image and text show, then the text fades, then the image fades to the next image and text.  So, both the image and text are displaying simultaneously, but the text fades first and then the image. 

Q2: How do I synchronize the text to display AND fade at the same time as the image?

Here is the relevant code:

  1.     if (!cs.IsClientScriptBlockRegistered(csType, "faderStartup"))
  2.             {
  3.                 StringBuilder stb = new StringBuilder();
  4.                 stb.Append("jQuery(document).ready(function()");
  5.                 stb.Append("{jQuery('.slideshowfader').fadeSlideShow({");
  6.                 stb.Append("height: 472,");
  7.                 stb.Append("width: 666,");
  8.                 stb.Append("speed: 2000,");
  9.                 stb.Append("interval: 4000,");
  10.                 stb.Append("ListElement: false,");
  11.                 stb.Append("});");
  12.                 stb.Append("});");
  13.     
  14.                 cs.RegisterClientScriptBlock(csType, "faderStartup", stb.ToString(), true);
  15.             }

HTML image list

  1.     <div class="slideshowwrapper">
  2.         <div id="ctl00_slideshow" class="slideshowfader">
  3.             <img src="uploads/flashgallery/beryllium_limestone10.jpg" alt="Beryllium Limestone Table" style="border-width: 0px;" />
  4.             <div class="slideShowDescr"><%--Needs to display below image in sync with image--%>
  5.                  <span>Beryllium Limestone Table</span>
  6.             </div>
  7.             ...
  8.         </div>
  9.     </div>