JQuery Cycle Synchronization

Question

I have defined two slideshow by JQuery cycle below:

    $('#slideShow').cycle({
        fx: 'fade',
        timeout: 3000,
        speed: 2000,
        random: 1
    });

    $('#slideText').cycle({
        fx: 'blindZ',
        timeout: 3000,
        speed: 2000,
        random: 1
    });

I have validated manually and they are in sync. Actually is that just luck or I need to define something like below to ensure they are in sync:

1. set timeout parameter as 0 in cycle to ensure it will not auto update.
2. use setInterval function with same interval to trigger each cycle.

Thanks for your kind assistance.

Answer 1

As long as you start your two slideshows one after another, it should be ok. Since they have the same timeouts and are started together, they should stay in sync.

Otherwise you could do something like this ;

$('#slideShow').cycle({
    fx: 'fade',
    timeout: 3000,
    speed: 2000,
    random: 1,
    after: function(currSlideElement, nextSlideElement, options, forwardFlag) {
          $('#slideText').cycle('next');
    }
});

$('#slideText').cycle({
    fx: 'blindZ',
    timeout: 0,
    speed: 2000,
    random: 1
});

The second slideshow is deactivated, and the first one sends a 'next' command after each change.