jqueryui диалоговое расположение

Question

Я использую пользовательский интерфейс JQuery и хотел бы расположить диалог горизонтально по центру, но вертикально выше центра, возможно, на фиксированное количество пикселей или на относительное расстояние от верхней части страницы.Есть простой способ сделать это?Похоже, есть только пара предопределенных значений, или я могу использовать точную позицию, но есть ли простой способ сделать это?

 $("#dialog-form").dialog({
                autoOpen: false,
                width: 630,
                position: 'center',
                modal: true,
                resizable: false,
                closeOnEscape: false

            });

Answer 1

Используйте параметр положения , чтобы выровнять верх диалогового окна с верхом окна (плюс смещение в пикселях или процентах).

Это должно центрировать диалог горизонтально и располагать его150 пикселей сверху.

$("#dialog-form").dialog({
    autoOpen: false,
    width: 630,
    position: { my: 'top', at: 'top+150' },
    modal: true,
    resizable: false,
    closeOnEscape: false
});

В старых версиях пользовательского интерфейса jQuery использовался массив, содержащий пару координат [x, y] в пиксельном смещении от левого верхнего угла области просмотра (например, [350,100]).

var dialogWidth = 630;
$("#dialog-form").dialog({
    // ...
    width: dialogWidth,
    position: [($(window).width() / 2) - (dialogWidth / 2), 150],
    // ...
});

Answer 2

Это сработало для меня

 position: { my: "center", at: "center", of: window },

Также вы можете проверить позиции диалога здесь
Найти позицию

Answer 3

я сталкивался с этим во время поиска того же вопроса, но у меня уже был мой ответ:

position: ['center', 'top+100']

это будет центрироваться горизонтально и в 100 пикселях сверху

это также работает

position: ['center', 'center+100']

по центру по горизонтали и 100 пикселей снизу от центра

Answer 4

Если кто-либо создает ссылку, открывающую диалоговое окно jQuery, из-за того, что class имеет ссылку на обработчик события click, вы можете заметить, что она может перейти в начало страницы но создайте модальное диалоговое окно глубже вниз по странице, и вы должны перейти к нему.

Если кто-то просто пытается помешать диалогу jQuery прыгнуть наверх, желая, чтобы он оставался рядом с нажатой ссылкой, просто удалите href. Почти сошел с ума, пытаясь решить эту проблему. Спецификация HTML5, по-видимому, понимает href="" или href="#" как означающее переход к вершине.

Answer 5

position: { 
   my: 'top', 
   at: 'top+150' 
}

работал на меня.

Answer 6

Попробуйте это:

    position: {
        my: 'top',
        at: 'top',
        of: $('#some-div')
    },

Answer 7

Я корректировал ответ Exlord, чтобы соответствовать.

позиция: ['center-7%', 'center-12%']

Это регулирует по горизонтали и вертикали

$(".popup").dialog({    
position: ['center-7%', 'center-12%'],
title: 'Updating',
    width: "auto",
}
});

Answer 8

применить css в вашей # диалоговой форме, использовать% sample

если ширина = 1000

поместить

левый: 50% Левое поле: -500px;

чтобы сделать его центрированным. или вы можете использовать iframe.