3

ユーザーがウィジェットを操作できるユーザー ダッシュボード プロジェクトに取り組んでいます (iGoogle ダッシュボードに非常に似ています)。iframe を保持するために jQueryUI ポートレットを使用しています。私が直面している問題は、iframe 内のコンテンツが jQuery アニメーションを使用して拡大するときに、リアルタイムで iframe のサイズを変更したいということです。たとえば、iframe 内にカスタム アコーディオン コントロールがあります。ユーザーがパネルをクリックしてアコーディオンを展開すると、slideDown() 関数を呼び出してコンテンツを表示します。slideDown() アニメーションが完了したら、ボディの新しい高さに基づいて iframe のサイズを変更します。その結果、アコーディオンのコンテンツは、スライド アニメーション中にウィジェットの境界を超えるまで下にスライドします。アニメーションが完了すると、サイズ変更によって新しいウィジェットの高さが処理され、すべてが適切に表示されます。これはかなり途切れ途切れのアニメーションであり、iframe のサイズを変更して、slideDown() アニメーション中に iframe の本体の高さに拡張したいと考えています。スライド アニメーション中に体の高さに基づいて 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');
}
4

3 に答える 3

1

実行されたアニメーションのステップイベントを取得するには、1 つのアコーディオンを作成する必要があります。

アニメーションボックスを作成しました。ボックスが大きくなったり小さくなったりする場合、ステップ イベントは関数resizeIframe(height)を呼び出します。この関数は、親ドキュメントで同名関数resizeIframe(height)を再度呼び出します。このデモを試してください:

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

于 2013-01-09T21:16:00.643 に答える
-2

私の調査によると、iframe は拡張できません。固定の幅と高さを指定する必要があります。

于 2013-01-09T20:01:09.950 に答える