How can I make fancyBox 2 adjust its height to fit its contents?

I am trying to get a fancyBox to increase it in height when its contents are higher than the viewport. In this way, the user scrolls their content using the browser scroll bar. Instead, my fancyBox continues to get its own scrollbar.

I use only inline content, not iframe . These are the parameters that I set:

 $('.fancybox').fancybox({ autoSize: 'false', fitToView: 'false', maxWidth: 940 }); 

Adding scrolling: 'no' disables the content at the bottom. Explicitly detecting really high heights works, but I want the height to be determined dynamically.

+6
source share
3 answers

Boolean and integer values ​​should go without , so this

 $('.fancybox').fancybox({ autoSize: 'false', fitToView: 'false', maxWidth: 940 }); 

it should be

 $('.fancybox').fancybox({ autoSize: false, // shouldn't be true ? fitToView: false, maxWidth: 940 }); 

fitToView is actually an option that gives you what you need, but the quoted "false" didn't help you work. On the other hand, I'm not sure you should disable autoSize , because otherwise the inline content will not get its own height.

+5
source

That sounds a little strange. an ugly solution is to use css, overflow: hidden;

Whenever I use fancybox, the scrollbars work correctly. that oc fancybox content doesn't set a different height?

Edit: A viewed example site. It appears that the content, which is larger than the fancybox itself, has a certain width.

0
source

If anyone is looking for a solution for iframe , use:

 parent.jQuery.fancybox.update(); 
0
source

Source: https://habr.com/ru/post/943858/


All Articles