anythingSlider onShowPause

Question

I have two sliders. Necessary that they stopped at the same time, when hover on some of them. My code:

    $('.slider').anythingSlider({   
                autoPlay            : true,
                delay               : 1000,  
                autoPlayLocked      : true,
                infiniteSlides      : false,
                stopAtEnd           : false,

                onShowUnpause : function(e, slider){
                    $('.slider').each(function() {
                        $(this).data('AnythingSlider').startStop();
                    });

                },

                onShowPause: function(e, slider){
                    $('.slider').each(function() {
                        $(this).data('AnythingSlider').startStop(false);
                    });

                }
            });

But this not working

Answer 1

When using the startStop() function, it actually completely stops the slideshow, so the onShowUnpause function will never fire. Try this instead (demo):

$('.slider').anythingSlider({
    autoPlay: true,
    delay: 1000,
    resumeDelay : 1000,
    autoPlayLocked: true,
    infiniteSlides: false,
    stopAtEnd: false,
    onShowPause: function (e, slider) {
        $('.slider').each(function () {
            $(this).data('AnythingSlider').startStop();
        });
    }
}).on('mouseleave', function () {
    $('.slider').each(function(){
        $(this).data('AnythingSlider').startStop(true);
    });
});