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!

Reply via email to