StrattonL
StrattonL

Reputation: 726

JQuery Cycle Pausing

I wish to pause the slideshow for about 4 seconds with no slide displayed before resuming. Is this possible? I have tried to do this myself with the following code but it does not seem to work.

$(document).ready(function () {
        $('#homeSlideshowWrapper').cycle({
            fx: 'fade',
            timeout: 4000,
            after: onBefore
        });

        function onBefore() {
            $('#homeSlideshowWrapper').cycle('pause')
            $('#homeSlideshowWrapper').delay(5000).cycle('resume')

        } });

Thanks

Luke Stratton

Upvotes: 1

Views: 462

Answers (2)

Truk
Truk

Reputation: 133

First of all, you are missing semicolons on both commands in the onbefore function. Second of all, you are declaring a function inside of the document.ready, where it really should not be in any function. Third is that you should use .css(display, 'none') to hide the slideshow while it's paused (if that's what you mean by no slide displayed before resuming. If not get rid of the hide() and show() at the line ends). Try this:

$(document).ready(function () {
    var onBefore= function() {
        $('#homeSlideshowWrapper').cycle('pause').hide();
        $('#homeSlideshowWrapper').delay(5000).cycle('resume').show();
    };

    $('#homeSlideshowWrapper').cycle({
        fx: 'fade',
        timeout: 4000,
        after: onBefore
    });

});

That may not be perfect, but should be a bit better.

Upvotes: 1

Nils Luxton
Nils Luxton

Reputation: 766

Can you achieve this with setTimeout?

E.g.

function onBefore() {
    $('#homeSlideshowWrapper').cycle('pause');
    $('selector-for-active-slide').css('visibility', 'hidden'); // If you wish the slide to disappear, not sure what you mean by "no slide displayed before resuming"
    setTimeout(resumeSlideshow, 5000);
}
function resumeSlideshow() {
    $('#homeSlideshowWrapper').cycle('resume');
    $('selector-for-active-slide').css('visibility', 'visible');
}

Upvotes: 0

Related Questions