5

jqueryuiを使用してフルスクリーンダイアログを作成しようとしています。

ajaxを介していくつかのコンテンツをロードしましたが、結果がダイアログに表示されます。

function openResource(id) {
  $.ajax({
    url      : "",
    type     : 'post',
    dataType : 'html',
    data : {
      idRes: id
    },
    success : function(response) {
      $("#popupRecurso")
        .html("<div style='float:right; cursor: pointer;' onclick='$(\"#popupRecurso\").dialog(\"destroy\");'>fechar</div>" + response);

      $("#popupRecurso").dialog({
        title       : '',
        bgiframe    : true,
        position    : 'center',
        draggable   : false,
        resizable   : false,
        dialogClass : 'dialogRecurso',
        width       : $(window).width(),
        height      : $(window).height(),
        stack       : true,
        zIndex      : 99999,
        autoOpen    : true,
        modal       : true,
        open        : function() {
          $(".ui-dialog-titlebar").hide();
        },
        error : function(err) {
          alert(err);   
        }
      });
    }
  });
}

残念ながら、ダイアログは中央に表示されず、正しいサイズが表示されません。誰かが同じ問題を抱えたことはありますか?

ありがとう

4

1 に答える 1

1

これに影響を与える可能性のある変数の違いをよりよく理解するために、これをjfiddleで確認したいと思います。ダイアログプロパティの[幅]と[高さ]の設定を削除し、ダイアログコンテンツを呼び出すコンテナに幅:100%と高さ:100%のcssプロパティを追加してみてください。「#popupRecurso」。そうすれば、ダイアログのプロパティはそれを上書きせず、サイズのDOM変更イベントによって変更されます。私は現在、私の会社でモーダルをよく扱っていますが、同様の問題があります。私はcssプロパティをwidth:%120、height:120%のようなものに設定するのが好きです。このようにして、ユーザーがズームインまたはズームアウトした場合でも、探しているダイアログ機能は忠実に保たれます。うまくいけば、これはあなたを助けるでしょう。ハッピーコーディング!

于 2013-01-24T03:48:12.403 に答える