How to do I set fancybox minHeight and maxHeight?

Question

fancybox version: 2.1.0

description: I don't want to upgrade to version 3 because it will affect the others.

So how can the minHeight and maxHeight values be effective in the current version?

I tried the following method, but it didn't work.

//source code

$.fancybox.open({
            href: '#advancedSearchWrapper',
            maxHeight: 500,
            minHeight: 300,
            fitToView: true,
            autoSize: true,
            modal: true,
            autoScale: true,
)}

Answer 1

To make minHeight and maxHeight options effective you need to set autoSize option to false.

$.fancybox.open({
  href: '#divContent',
  maxHeight: 150,
  minHeight: 100,
  fitToView: true,
  autoSize: false,
  modal: true,
  autoScale: true,
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/jquery.fancybox.css" type="text/css" media="screen" />
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/jquery.fancybox.pack.js"></script>

<div id="divContent">
  Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content
  Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content...
</div>