Malsup Cycle jQuery plugin - problem with caption

Malsup Cycle jQuery plugin - problem with caption

hi,

first off i'd just like to say what an absolutely superb plug-in this is... so simple to use and with so much customisation... 

i'm having a small problem with getting the captions to display from a slideshow... i've got multiple slideshows on the page which i guess could be causing the problem... i'm not getting any errors, but no caption is being displayed...

here is a section of my html.... can anyone suggest what i might be doing wrong...


  2. <script>
  3. $(document).ready(function() {
  4.     $('#cat_slide1').cycle({
  5. fx: 'scrollHorz',
  6. timeout: 0, 
  7.    next:   '#next1', 
  8.         prev:   '#prev1',
  9. after:  function() {
  10.             $('#caption1').html(this.alt);
  11.         }
  12. });
  14.     $('#cat_slide2').cycle({
  15. fx: 'scrollHorz',
  16. timeout: 0, 
  17.    next:   '#next2', 
  18.         prev:   '#prev2',
  19. after:  function() {
  20.             $('#caption2').html(this.alt);
  21.         }
  22. });

  24. });
  25.  </script>
  26. <div id="cat_slide1" class="cat_slide_content"> 
  27. <div class="slide_item"><img src="db/content/sica.jpg" alt="new 1 brief"></div>
  28. <div class="slide_item"><img src="db/content/bench1.jpg" alt="new 2 brief"></div>
  29. <div class="slide_item"><img src="db/content/table1.jpg" alt="new 3 brief"></div>
  30. </div>
  31. <div class="control_holder">
  32. <div class="slide_controls"><img src="images/but_left.gif" width="31" height="32" style="margin-right:40px;" id="prev1"><img src="images/but_right.gif" width="31" height="32" id="next1"></div>
  33. <div id="caption1" class="caption_text"></div></div>

  35. <div id="cat_slide2" class="cat_slide_content">
  36. <div class="slide_item"><img src="db/content/mozar1.jpg" alt="new 4 brief"></div>
  37. <div class="slide_item"><img src="db/content/sica.jpg" alt="new 1 brief"></div>
  38. <div class="slide_item"><img src="db/content/bench1.jpg" alt="new 2 brief"></div>
  39. <div class="slide_item"><img src="db/content/table1.jpg" alt="new 3 brief"></div>
  40. </div>
  41. <div class="control_holder">
  42. <div class="slide_controls"><img src="images/but_left.gif" width="31" height="32" style="margin-right:40px;" id="prev2"><img src="images/but_right.gif" width="31" height="32" id="next2"></div>
  43. <div id="caption2" class="caption_text"></div></div>

as you can see i have here 2 slideshows, each with their own navigation controls... this works perfectly... for some reason though the caption divs remain empty...

thanks in advance for any help :)

dog