jQuery UI dialog positioning : adjust position top by 20px -

问题

I have a dialog that gets filled by an ajax call. I want to limit the max-height of dialog and also allow it to be scroll-able if this max-height is exceeded. The code below does exactly what I want.

The catch is I can not move the top of the dialog from the top position. I can move it left and right. I can't use center either as the dialog is displayed in a large scroll-able window. If I use firebug I can adjust the top property but cannot find where it is being set to zero.

$("#your-dialog-id").dialog({
    open: function(event, ui) {
        $(this).css({'max-height': 500, 'overflow-y': 'auto'});
    },
    autoOpen:false,
    modal: true,
    resizable: false,
    draggable: false,
    width: '690',
    closeOnEscape: true,
    position: 'top'
});

I want to adjust the dialog's y position so it is 20px from the top of the window. Any idea what I can do?

回答1:

Changing the last value solved the problem:

position: ['center',20] 

http://jsfiddle.net/chrisloughnane/wApSQ/3

回答2:

The easiest way is:

$("#dialog").dialog({ position: { my: "center", at: "top" } });

回答3:

using Jquery UI 1.11.4

        var Y = window.pageYOffset;

        $( "#dialogJQ" ).dialog({
            modal: true,
            closeOnEscape: false,                
            width:'auto',
            dialogClass: 'surveyDialog',
            open: function(event, ui) {
                $(this).parent().css({'top': Y+20});
            },
        });

来源：https://stackoverflow.com/questions/11230645/jquery-ui-dialog-positioning-adjust-position-top-by-20px