I tried to add in the ‘Extra calls’ tab:
$('body').fancybox({
helpers: {
overlay: {
locked: true
}
}
});
And then, in the ‘Miscellaneous’ tab, I tried to add callbacks for the onStart and onClose functions:
beforeShow: function(){
$("body").css({'overflow-y':'hidden'});
},
afterClose: function(){
$("body").css({'overflow-y':'visible'});
}
But nothing seems to work. It doesn’t seem like there’s a ‘fancybox-lock’ in the css, or anything similar that I could set to “hidden” or something like that…
Could anyone help me? That’s the only thing missing for everything to work on my blog.
Hi,
First note i you might be referring to the documentation and settings in fancybox v2, while this plugin uses fancybox v1: http://fancybox.net/api
The extraCalls setting is not going to help in this case but the callbacks should work. Try forcing it on the html tag as well:
onStart: function(){
$("html, body").css({'overflow-y':'hidden', 'height':'100%'});
},
onClosed: function(){
$("html, body").css({'overflow-y':'visible', 'height':'auto'});
}
Keep in mind you only need to write the function declaration for each callback setting in the options panel, so for example for the start callback field you would type:
function(){
$("html, body").css({'overflow-y':'hidden', 'height':'100%'});
}
Hi, Jose, thanks for your answer and sorry for the delay in answering you back.
I tried adding the callbacks (‘Miscelaneous’ tab, onStart and onClosed events), but it just didn’t work.
I have two contents that are opened by Fancybox, pictures and html in iframes. The iframe content (which is the one I want to set these settings the most for) are opened by a code I added in the ‘Extra calls’ tab, and they weren’t at all changed by the codes you suggested to me. This is the code I use for the iframes:
jQuery(".fancybox-iframe").fancybox({
'transitionIn': 'none',
'transitionOut': 'none',
'speedIn': 600,
'speedOut': 200,
'type': 'iframe',
'width': 1050,
'height': 700,
'overlayColor': '#000',
'overlayOpacity': 0.2,
'scrolling': 'no',
'padding': 0,
'showCloseButton': false,
'scrolling': 'no',
'centerOnScroll': true,
'showNavArrows': true
});
As for the images, they stopped opening at all when I added the codes you suggested.
Any ideas would be welcome.