Question

I would like to disable the parent windows access of scrollbars when the fancybox is open. I accomplished something similar with shadowbox using the following:

function SBopen() {
            document.body.style.overflow = "hidden";  //Hide navigation overflow when SB open
        }
        function SBclose() {
            document.body.style.overflow = "auto";  //Show navigation overflow when SB open
        }
        Shadowbox.init({
            handleOversize: "none",
            modal: false,  //false lets user click outside SB to close window
            onOpen: SBopen,
            onClose: SBclose
        });

However I am not sure how to accomplish this with fancybox. My current init script for fancybox looks like this:

  $(document).ready(function() {
    $(".fancybox-thumb").fancybox({
        padding : 2,
        modal : false,
        prevEffect  : 'fade',
        nextEffect  : 'fade',
        nextSpeed   : 'slow',
        prevSpeed   : 'slow',
        openSpeed   : 'slow',
        closeSpeed  : 'slow',
        helpers : {
            title   : {
                type: 'outside'
            },
            overlay : {
                opacity : 0.8,
                css : {
                    'background-color' : '#000'
                }
            },
            thumbs  : {
                width   : 50,
                height  : 50
            }
        }
    });
});

Any idea how to accomplish this?

Thanks in advance!

Answer 1

Add these options to your script:

  beforeShow: function(){
   $("body").css({"overflow":"hidden"});
  },
  afterClose: function(){
   $("body").css({"overflow":"visible"});
  }