javascript - 加载了 ajax 调用的 Jquery ui 对话框不会水平居中

Question

我有一个对话框，一旦 ajax 调用加载了未知大小的图像，就会调用该对话框。我有最大高度和最大宽度。我发现了类似的问题，但答案并没有解决我的问题。截至目前，我将屏幕宽度除以 4 以设置 X 坐标。然而，这并不完全使窗口居中。

var windowWidth = $(window).width()
var modalCenter = windowWidth/4;
$("#userImage").dialog({
    autoOpen: false,
    modal: true,
    width: 'auto',
    create: function (event, ui) {
           $(this).css("maxWidth", "700px");
    },
    height: 'auto',
    maxHeight: 600,
    show: { effect: 'fold', duration: 250 },
    position: [modalCenter, 100],
    buttons: {
        Cancel: function () {
        $(this).dialog("close");
    },
    Crop: function () {
     var x = $('#x').val();
     var y = $('#y').val();
     var w = $('#w').val();
     var h = $('#h').val();
     if (!checkCoords())
        return false;
     $.ajax({
         url: "CropImage.aspx?x=" + x + "&y=" + y + "&w=" + w + "&h=" + h,
         cache: false
     }).done(function (html) {
         //another ajax call will get all images as a list and display them where they can be set as primary images/subImages
       })
    }
  }
});

这是一张图片:

Answer 1

当你的 ajax 完成后，你能重新定位对话框吗？

类似于:

Crop: function(){
    var self = $(this);
    $.ajax({...}).done(function(){
        self.position({
            my: "center",
            at: "center",
            of: window
        });
    });
}