YUI パネルをダイアログとして使用中に問題が発生しました。
ページの読み込み時に JavaScript で作成されたダイアログ オブジェクトがあります。
$J = jQuery;
dialog = new YAHOO.widget.Panel("dialog", { width: "300px", fixedcenter: true, close: true, draggable: true, zindex: 4, modal: true, visible: false });
次に、ページのイベントから loadDialog() 関数を呼び出すと:
dialog.setBody("<iframe id=\"ifrDialog\" scrolling=\"no\" frameborder=\"0\" marginheight=\"0\" marginwidth=\"0\"></iframe>");
dialog.hideEvent.subscribe($$F.endDialog);
dialog.render(document.body);
// Set iframe
$J("#ifrDialog").get(0).contentWindow.location.replace(url);
それからトリッキーな部分は、IFRAME がドキュメントの読み込みを完了した後に、Panel とIFRAMEオブジェクトのサイズを変更する必要があることでした。IFRAME ドキュメントの幅と高さを取得し、IFRAME のサイズをスクロール バーなしでドキュメントに合わせて変更し、YUI パネルのサイズを変更して IFRAME が正しく含まれるようにしました。
これが完了したら、次のように呼び出します。
dialog.center();
これにより、YUI モーダル パネルが画面の中央に正しく配置されます。すべてが初めてです。もともとダイアログを閉じたいときに、destroy() メソッドを使用してドキュメントから完全に削除しようとしましたが、config null 参照エラーが発生し続けたため、ダイアログを非表示にしました。同じページのダイアログを再度表示しようとすると、実際の問題が発生します。パネルが正常に表示されるようになりましたが、ブラウザ ウィンドウに垂直スクロールバーが表示されるべきでない場合に表示されるようになりました。
何らかの理由でモーダル オーバーレイが成長していますか? 必要に応じて動的に追加できるように、パネルを * リセット * またはドキュメントから削除する方法はありますか?
また、ウィジェットは同じですが、問題は異なります。YUI パネルのサイズと位置を変更した後、別の興味深い状況に遭遇しました。アンダーレイが、パネルの新しいサイズに合わせて拡大されませんでした。アンダーレイのサイズを手動で変更する必要がありました。これを行うより良い方法はありますか?
助けてくれてありがとう。
ダニエル