Search code examples
jqueryfancybox-2supersized

Stop, Start supersized on fancybox


I was trying to use supersized and fancybox togheter. I added some html to supersized.js to display images with fancybox into each slide, in the default captions box, which is div id=slidecaption.

All works, but i was trying to stop and re-start the supersized slideshow when fancybox open/close.

This code works fine to stop the slideshow:

<script type="text/javascript">
jQuery(document).ready(function(){
$('#slidecaption').click(function() {
api.playToggle();
});
});
</script>

but i can't find a way to re-start the slideshow when i close fancybox. There's the div class=fancybox-overlay, but i repeat the above code for it:

<script type="text/javascript">
jQuery(document).ready(function(){
$('.fancybox-overlay').click(function() {
api.playToggle();
});
});
</script>

.....nothing works.

Do you suyggest something easier?

Thank you very much


Solution

  • Try using fancybox callbacks within your fancybox custom initialization like :

    $(".fancybox").fancybox({
        beforeLoad: function () {
            api.playToggle(); // stop / pause
        },
        afterClose: function () {
            api.playToggle(); // restart
        }
    });