How to make Height Auto on Colorbox?

jquery height colorbox
Ben picture Ben · Oct 17, 2012 · Viewed 23.2k times · Source

I'm using a jQuery plugin called ColorBox and basically it creates a jquery modal however the modal has a fixed size height of "500" and I want it to have a minimum height but also I have expending menus within the modal so I would like to to automatically expand. How do I do this?
The code I currently have is: 

$(".colorboxlink1").colorbox({
  opacity:"0.2",
  width:"450",
  height:"500",
  title:"To close this dialog click X icon at the right", 
  iframe:true
});

Iv tried deleting the Height from this and using CSS, but that didnt work. Iv tried putting what I know of jquery in this line, but nothing seems to work, however I am pretty new to jQuery. Anyone got any ideas?

Answer

webdeveloper picture webdeveloper · Oct 17, 2012

You can use this:

$('.colorboxlink1').colorbox({ 
    onComplete : function() { 
       $(this).colorbox.resize(); 
    }    
});

And this in your code after colorbox was initialized:

$.colorbox.resize();

Related questions

How do you get the rendered height of an element?

How do you get the rendered height of an element? Let's say you have a <div> element with some content inside. This content inside is going to stretch the height of the <div>. How do you …

Read More
jquery $(window).width() and $(window).height() return different values when viewport has not been resized

I am writing a site using jquery that repeatedly calls $(window).width() and $(window).height() to position and size elements based on the viewport size. In troubleshooting I discovered that I am getting slightly different viewport size reports in repeated …

Read More
jquery get height of iframe content when loaded

I have a Help page, help.php that I am loading inside an iframe in main.php How can I get the height of this page once it has loaded in the iframe? I am asking this because I can't …

Read More