Search code examples
jqueryfancybox

How to use FancyBox to auto resize the height?

I am using Fancybox for a clients project (we paid for the full license!)

I have a link which opens this box, and then there are 3 expandable sections which are displayed. If one is clicked, then a section slides down using JQuery.

I would like fancybox's height to automatically re-size when the section is expanded. Is this possible? I've tried using "auto" but it's not supported. 

    $(".fancybox").fancybox({
    openEffect: 'fade',
    scrolling: 'yes',
    overlay : { 
        locked : false 
    },
    'autoSize': false,
    width: 700,
    height: 360,
    openSpeed: 100,
    helpers: {
        overlay: {
            css: {
                'background': 'rgba(000, 000, 000, 0.50)'
            }
        }
    }
});
Solution

  • Check this Fiddle, just remove this options from your code:

     'autoSize': false,
 width: 700,
 height: 360,