Search code examples
jquerypluginscallbackslidercycle

Cycle plugin caption with one slide

I can not get to see the div (.caption) if the slider contains only one slide (image), while if the slider contains multiple slides you see the correct div (.caption) for each slide.

Is there an alternative to after property?

Thank you very much for the help!

Here is the code:

<div id="slideshow">
    <div>
        <img src="images/slide1.jpg" width="500" height="500" />
    </div>
</div>


$('#slideshow')
    .after('<div id="products-nav">')
    .cycle({
        fx:     'fade',
        speed:  2000,
        timeout: 0,
        next:   '#next',
        prev:   '#prev',
        pager:  '#products-nav',
        after:function(curr,next,opts) {
            var index=opts.currSlide;
            $('#caption .caption:visible').fadeOut();
            $('#caption .caption').eq(index).fadeIn();
            tooltip();
        }
    });
Solution

  • Add the option slideExpr: 'img' (or 'div') to force cycle to understand what is the slide. Currently, you don't have a list of plural slides, so it can't determine automatically what is the slide !

    Here a demo of slideExpr: http://jquery.malsup.com/cycle/slideExpr.html