jQuery ui全屏对话框

时间:2012-05-28 15:38:30

标签: jquery dialog fullscreen

我正在尝试使用jquery ui进行全屏对话。

我通过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);   
        }
      });
    }
  });
}

不幸的是,对话框没有出现在中心,没有正确的尺寸。 有没有人遇到过同样的问题?

由于

1 个答案:

答案 0 :(得分:1)

我想在jfiddle中看到这一点,以便更好地理解可能影响这一点的任何变量差异。尝试删除对话框属性的“宽度”和“高度”设置,并将宽度:100%和高度:100%的css属性添加到为对话框内容调用的容器中。 “#popupRecurso”。这样,对话框属性不会覆盖它,并且它会随着任何大小的DOM更改事件而更改。我目前在我的公司工作很多模型,并且遇到了类似的问题。我喜欢将css属性设置为宽度:%120,高度:120%。这样,即使用户缩放方式,您正在寻找的对话功能也会保持正确。希望这会帮助你。快乐的编码!