Question

I have this kind of jquery cycle handling 2 elements (#rotator1, #rotator2) :

    $("#rotator1, #rotator2").cycle(
        {
            fx: 'fade',
            sync: 1,
            speed: 800,
            prev: '#headerButtonBack',
            next: '#headerButtonNext',                
            timeout: 4000,
            pause: 1
        }
    );

and I’d like, when a user is on #rotator1 with mouse (mouseover), block also the cycle of the #rotator2.

Is it possible? How? Thanks

Answer 1

Give both slideshow a certain class (i used pics);

On hover you can do something like:

$('#rotator1, #rotator2').hover(function() {
    $('.pics').cycle('pause'); return false;
}, function() {
    $('.pics').cycle('resume'); return false;
 });

There is a jsfiddle:
http://jsfiddle.net/psxgT/1/