Try using the 'after' callback:
$(function() {
$('div#slides').cycle({
timeout: 7000,
pause: 1,
pager: 'div#buttons',
pagerAnchorBuilder: function(idx) {
return '<a id="pager-' + idx + '" href="#">' + idx + '</
a>';
},
after: function(curr, next, opts) {
var alt = $(next).attr('alt');
$('#caption').html(alt);
}
});
});
On Nov 21, 6:36 pm, Wroathe <reallyto...@gmail.com> wrote:
> Hi there! I'm a little stuck and I was hoping someone could help me.
> I've been trying to add captions to another div separate from the
> slideshow and have them cycle with the slideshow and when the user
> uses the pager. The one catch is I was hoping to use the images in the
> slideshow's alt attributes as the captions. Here's the code, it'll do
> a better job of explaining than I can.
>
> The JS is as follows:
> $(function() {
> $('div#slides').cycle({
> timeout: 7000,
> pause: 1,
> pager: 'div#buttons',
> pagerAnchorBuilder: function(idx) {
> return '<a id="pager-' + idx + '" href="#">' + idx + '</a>';
> }
> });
>
> });
>
> The container I specified to contain the captions is
> <div id="buttons">Pager anchors are here.</div>
> <div id="captions"><span>Alt attribute would go here.</span></div>
>
> The slideshow div looks like this
>
> <div id="slides">
> <div class="featured-image"><a href="slide1.html"><img
> src="images/image1.jpg" alt="This alt should be displayed as a caption
> in #captions." height="300px" width="940px" /></a></div>
> <div class="featured-image"><a href="slide2.html"><img
> src="images/image2.jpg" alt="This alt should be displayed as a caption
> in #captions." height="300px" width="940px" /></a></div>
> <div class="featured-image"><a href="slide3.html"><img
> src="images/image3.jpg" alt="This alt should be displayed as a caption
> in #captions." height="300px" width="940px" /></a></div>
> </div><!--end slides-->
>
> So I want the alts to become the captions and to change when the
> slideshow auto-advances or when the user clicks on the appropriate
> pager.
>
> Sorry, I'm a major noob :(
>
> Thanks in advance for any help!
