1

jQuery UIダイアログを使用して、新しいiFrameにコンテンツを表示しています。ダイアログが表示されている間、ダイアログの親ウィンドウに水平スクロールバーが表示されることを除いて、すべてがうまく機能します（IE8）。580px divのiFrameのページ上の唯一のコンテンツにもかかわらず、ブラウザによって非常に広いと解釈されるiFrame内の<html>要素の問題を追跡しました。

iFrame内のHTMLタグとBODYタグにCSSを追加しようとしました（例：幅：98％または幅：600px;）...いずれも影響がないようです。

ダイアログを開くためのコードは以下のとおりです。助言がありますか？

$("a[providerId]").click(function(e) {
                e.preventDefault();
                var $this = $(this);
                var $width = 600;
                var $height = 400;
                $('<iframe id="companyDetail" class="companyDetail" style="padding: 0px;" src="' + this.href + '" />').dialog({
                    title: $this.attr('title'),
                    autoOpen: true,
                    width: $width,
                    height: $height,
                    modal: true,
                    resizable: false,
                    autoResize: true,
                    overlay: {
                        opacity: 0.5,
                        background: "black"
                    }
                }).width($width).height($height);
            });

更新：コードを入手したこれらのデモをチェックして、私が話していることを確認してください（IE8で）：http ：//elijahmanor.com/demos/jqueryuidialogiframe/index.html

4

4 に答える 4

6

これはjQueryUI1.7.2の小さなバグのようで、現在この問題に関する未解決のチケット（＃3623）があります。チケットコメントでは、2つの解決策が提案されています。

ソリューションA

jquery-ui-1.7.2.custom.cssを変更します：

  1. 検索します.ui-widget-overlay。
  2. 次のルールを追加しますposition:fixed;。

ソリューションB

jquery-ui-1.7.2.custom.min.jsを変更します。

  1. addClass("ui-widget-overlay").css({width:this.width(),height:this.height()});行97で検索します。
  2. 削除し.css({width:this.width(),height:this.height()})ます。
于 2009-12-12T05:52:35.857 に答える
1

私の最初の考えはoverflow-x : hidden、IE8の標準モードとクァークズモードの場合、トリックを実行し、水平バーが消えることでした。あなたがする必要があるのはそれをbodyタグに置くことだけです。

于 2009-12-13T06:46:05.963 に答える
0
  • モーダルUIが表示されている場合にのみ発生する場合は、オーバーレイを担当するdivを制御するcssを確認してください。
  • Doctypeも確認してください。
  • 遊んでみましたoverflow:hidden か？

問題のオンラインデモにURLを投稿すると役立ちます。

于 2009-12-06T19:17:15.550 に答える
0

私も同じ問題を抱えていました。私の場合、ダイアログは本体の子であり、オーバーフローを防ぐために次のスクリプトを使用しました。

$("#your-dialog").dialog({
  //our options,
  open: function(){
    $("body").css("overflow", "hidden");
  },
  close: function(){
    $("body").css("overflow", "initial");
  }
});
于 2015-03-17T13:33:18.000 に答える