Изменение размера fancybox с динамическим контентом

Question

Я использую fancybox, и когда загружается ящик, мне нужно вставить некоторые элементы в неупорядоченный список (ul) внутри поля. Проблема в том, что когда я вставляю элементы, содержимое больше, чем само окно, поэтому мне нужно изменить размер окна при обновлении содержимого. Я не могу заставить его работать с $ .fancybox.resize(). Как изменить размер окна при добавлении нового контента?

JQuery:

$("a#OpenPopup").fancybox({ 'onStart': function() { loadContent(); } }); 

function loadContent(type) { 
    var items = "<li>Item1</li><li>Item2</li><li>Item3</li><li>Item4</li>"; //This items I load with an ajax call 
    $("#Popup u").html(items); 
    $.fancybox.resize(); //This doesn't resize 
} 

HTML, и CSS:

<a href="#Popup" id="OpenPopup"> 
<div style="display:none"> 
    <div id="Popup"> 
     <h1>Content</h1> 
     <ul></ul> 
    </div> 
</div> 

#Popup 
{ 
    text-align: left; 
    width: 400px; 
} 

Answer 1

Трис этот учебник ОТУ, я думаю, что это поможет вам:

Resizing fancybox height dynamically

Answer 2

Я бы использовать fancybox предоставил механизм ajax для загрузки контента. Вы вызываете «onStart», который является событием, вызываемым до того, как событие «ajax» загружает контент.

Используйте обработчик «ajax» для загрузки содержимого и вызова $ .fancybox.resize() в обработчике событий onComplete.

Я также обнаружил, что редактирование источника FancyBox использовать одушевленные Jquery вместо данного CSS прямого делает переход изменения размера гладкой

 //wrap.css({height: h + (currentOpts.padding * 2) + titleh}); 
    //inner.css({height: h}); 

    wrap.animate({ 
     height: h + (currentOpts.padding * 2) + titleh 
    }, 100); 

    inner.animate({ 
     height: h 
    }, 100); 

http://fancybox.net/api

Answer 3

Ссылка отправленного Trufa говорит в одном из комментариев исправление проблемы с изменением размера было реализовано в fancybox 1.3.4. Поэтому обновление fancybox.js до последней версии может решить проблему.