Динамическая настройка высоты iframe jQuery Fancybox в соответствии с измененным содержимым внутри

Я использую jQuery Fancybox для отображения форм в модальном окне. Я использую следующий код:

$("a.iframe").fancybox({
'padding': 0,
'width': 650,
'showCloseButton': false,
'hideOnContentClick': false,
'transitionIn': 'elastic',
'transitionOut': 'elastic',
'onComplete': function () {
  $('#fancybox-frame').load(function () {
    $('#fancybox-content').height($(this).contents().find('body').height() + 20);
  });
}
});

С помощью дополнительной функции onComplete я могу настроить высоту iframe в соответствии с высотой содержимого внутри.

Однако я скрыл несколько элементов с помощью jQuery .hide() внутри iframe. Всякий раз, когда я хочу .show() эти элементы, сам iframe не изменяет размер вместе с дополнительной высотой теперь видимых элементов.

Как я могу это сделать? Спасибо!


person Martijn van Turnhout    schedule 15.09.2011    source источник
comment
Я думаю, что у этой тенденции есть ответ на ваш запрос: Проблема с настройкой наложения Fancybox Iframe Ширина и высота   -  person JAY    schedule 16.12.2011


Ответы (1)


Поместите следующую функцию на страницу

$.fn.ResizeFancy = function(){
   $('#fancybox-content').height($('#fancybox-frame').contents().find('body').height() + 20);
};

После этого активируйте эту функцию для вашей функции showHide. Например;

function yourShowHideFn(){
    //bla bla bla

    $.fn.ResizeFancy();
}
person Sedat Kumcu    schedule 26.03.2013