Ich arbeite an einem Benutzer-Dashboard-Projekt, in dem ein Benutzer mit Widgets interagieren kann (sehr ähnlich zu iGoogle-Dashboard). Ich verwende jQueryUI-Portlets zum Speichern von Iframes. Das Problem, auf das ich stoße, ist, dass ich die Größe des Iframes in Echtzeit ändern möchte, wenn der Inhalt des Iframes mithilfe von jQuery-Animation erweitert wird. Zum Beispiel habe ich ein benutzerdefiniertes Akkordeon-Steuerelement in einem Iframe. Wenn der Benutzer auf ein Bedienfeld klickt, um das Akkordeon zu erweitern, rufe ich die slideDown () - Funktion auf, um den Inhalt anzuzeigen. Wenn die slideDown () -Animation abgeschlossen ist, ändere ich die Größe des Iframes basierend auf der neuen Körpergröße. Das Ergebnis ist, dass der Inhalt der Akkordeonfolie nach unten verschoben wird, bis er während der Folienanimation außerhalb der Grenzen des Widgets liegt. Sobald die Animation abgeschlossen ist, übernimmt die Größenänderung die neue Höhe des Widgets und alles sieht gut aus. Dies ist eine ziemlich abgehackte Animation, und ich möchte die Größe des Iframes ändern, damit er während der slideDown () - Animation auf die Körpergröße des Iframes erweitert wird. Was kann ich tun, um den Iframe basierend auf der Körpergröße während der Folienanimation zu erweitern?

Hier ist der Code, den ich gerade benutze.

// 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');
}