Развернуть iframe во время анимации jQuery Когда содержимое Expand

Я работаю над проектом пользовательской панели мониторинга, где пользователь может взаимодействовать с виджетами (очень похоже на панель управления iGoogle). Я использую портлеты jQueryUI для хранения iframes. Проблема, с которой я сталкиваюсь, заключается в том, что я хотел бы изменить размер iframe в режиме реального времени, когда содержимое внутри iframe будет расширяться с использованием анимации jQuery. Например, у меня есть пользовательский контроль аккордеона внутри iframe. Когда пользователь нажимает на панель для расширения аккордеона, я вызываю функцию slideDown() для отображения содержимого. Когда анимация slideDown() завершена, я изменяю размер iframe на основе новой высоты тела. В результате содержимое аккордеона скользит вниз, пока они не выйдут за пределы виджета во время анимации слайдов. Как только анимация будет завершена, размер изменяет размер новой виджеты, и все выглядит хорошо. Это довольно прерывистая анимация, и я хотел бы изменить размер iframe, чтобы он расширялся до высоты iframe во время анимации slideDown(). Что я могу сделать, чтобы развернуть iframe на основе высоты тела во время анимации слайда?

Вот код, который я сейчас использую.

// This code gets fired on an accordion panel click event.
content.slideDown(100, function ()
{
    parent.expandContainer('panel1', $('body').height());
});     

// This code resides in the parent page hosting the iframes.
function expandContainer(elementId, height)
{
    $('#' + elementId).children('.content').find('iframe').css('height', height + 'px');
}   

Ответ 1

Из моих исследований iframes нельзя развернуть. Они должны иметь фиксированную ширину и высоту.

Ответ 2

возможно, вам нужно сделать свой один аккордеон, чтобы получить шаговое событие выполненной анимации.

Я создал анимированную коробку. если поле становится больше или меньше, то пошаговое событие вызывает функцию resizeIframe (height). эта функция снова вызывает одноименную функцию resizeIframe (height) в родительском документе. попробуйте эту демонстрацию:

http://algorhythm.de/tools/resizeable-iframe/index.html

Ответ 3

В jQuery аккордеоне есть событие в его API, которое запускается после завершения анимации:

Запуск после активации панели (после завершения анимации). http://api.jqueryui.com/accordion/#event-activate

Использование этого события для запуска изменения размера iframe отлично подходит для меня.