CODEWITHSUNDEEP
jqueryfancyboxfancybox-2fancyimputefancyupload
Senle.Bao
Senle.Bao

Reputation: 11

How to do I set fancybox minHeight and maxHeight?

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,
)}

Upvotes: 1

Views: 1328

Answers (1)

ElasticCode
ElasticCode

Reputation: 7865

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>

Upvotes: -1

Related Questions