Làm cách nào để đặt Chiều cao tự động trên Hộp màu?

Question

Tôi đang sử dụng một plugin jQuery được gọi là ColorBox và về cơ bản nó tạo ra một phương thức jquery tuy nhiên phương thức có chiều cao cố định là "500" và tôi muốn nó có chiều cao tối thiểu nhưng tôi cũng có các menu mở rộng theo phương thức. muốn tự động mở rộng. Làm thế nào để tôi làm điều này?
Mã Tôi hiện đang có là:

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

Iv cố gắng xóa Chiều cao từ này và sử dụng CSS, nhưng điều đó didnt làm việc. Iv đã cố gắng đặt những gì tôi biết về jquery trong dòng này, nhưng không có gì có vẻ làm việc, tuy nhiên tôi khá mới với jQuery. Bất cứ ai có bất kỳ ý tưởng?

Answer 1

Bạn có thể sử dụng này:

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

Và điều này trong mã của bạn sau khi hộp thuốc vẽ được khởi tạo:

$.colorbox.resize(); 

Answer 2

tôi đã có một tình huống tương tự và tôi đã sử dụng một hàm setTimeout để cung cấp cho một số thời gian cho hộp màu để tải sau đó được gọi là phương pháp thay đổi kích thước.

tôi gọi là hộp thuốc vẽ

var profileHeight=jQuery('#profile').height(); //Get the height of the container  
    setTimeout(function(){ 
     jQuery.colorbox({ 
      html:jQuery('#profile').html(), 
      width:'50%', 
      height:profileHeight, 
      opacity:0.5})} 
     , 600); 
//Wait 700ms then resize 
setTimeout(function(){jQuery(this).colorbox.resize();},700); 

Đó đã cho tôi các chức năng mà tôi cần. Cửa sổ modal luôn thay đổi kích thước đến nội dung của container

Answer 3

Sử dụng phiên bản hiện tại của hộp thuốc vẽ, bạn có thể xác định kích thước tối đa trong phần trăm:

$(".colorboxlink1").colorbox({ 
    maxWidth: '95%', 
    maxHeight: '95%' 
}); 

Answer 4

Bạn có thể ràng buộc một sự kiện như thế này sau đó gọi thay đổi kích thước:

$(document).bind('cbox_complete', function() { 
    $.colorbox.resize(); 
}); 

nhìn cho 'móc sự kiện để xem những gì khác bạn có thể liên kết với ở đây: http://www.jacklmoore.com/colorbox/