пользовательского интерфейса jQuery 1.10: возможность диалога и свойства zIndex

Вы Don'т сказать это, но вы используете пользовательского интерфейса jQuery 1.10.

В пользовательского интерфейса jQuery 1.10 опцию свойства zIndex удаляется:

удалена опция свойства zIndex

подобная опция стек, опция zIndex равно лишнее надлежащее выполнение укладки. Значение z-индекса определяется в CSS и штабелирование сейчас контролируют обеспечение целенаправленного диалога последнего и"укладки" с элементом своего родителя.

вы должны использовать чистый CSS, чтобы установить диалог "на верху" по:

.ui-dialog { z-index: 1000 !important ;}

вам нужен ключ !важно чтобы переопределить стиль по умолчанию элемента; это влияет на все ваши диалоги, Если вам нужно установить ее только для диалогового окна, используйте опцию `dialogClass и стиль.

Если вам нужно модальное диалоговое окно установить модальные: True параметра` см. В документации:

если установлено значение true, то диалоговое окно будет модальным поведения; другие пункты странице будут отключены, т. е. не может быть взаимодействовали. Модал диалоги создать оверлей ниже диалоговое окно, но над другой странице элементы.

Вам нужно установить модальное наложение с более высоким Z-индекса для этого использовать:

.ui-front { z-index: 1000 !important; }

для этого элемента тоже.

Возможно, вы захотите попробовать диалоговое метод jQuery:

$( ".selector" ).dialog( "moveToTop" );

ссылка: http://api.jqueryui.com/dialog/#method-moveToTop

Добавить в ваш CSS:

 .ui-dialog { z-index: 1000 !important ;}

Есть несколько предложений, но насколько я вижу с jQuery пользовательского интерфейса ребята нарушили этот диалог под свой контроль и в настоящее время.

Я говорю это потому, что я включаю диалог на моей странице, а ее полупрозрачные и модальные вырубных див за некоторыми другими элементами. Что может'т быть правым!

В конце концов, основываясь на некоторые другие должности, я разработал это глобальное решение, как расширение виджета диалога. Это работает для меня, но я'м не уверен, что он будет делать если я открыл диалог внутри диалога.

В основном он ищет свойство zIndex все еще на странице и перемещается .пользовательского интерфейса-виджет-верхний слой должен быть один выше, а сам диалог будет одним больше.

$.widget("ui.dialog", $.ui.dialog,
{
    open: function ()
    {
        var $dialog = $(this.element[0]);

        var maxZ = 0;
        $('*').each(function ()
        {
            var thisZ = $(this).css('zIndex');
            thisZ = (thisZ === 'auto' ? (Number(maxZ) + 1) : thisZ);
            if (thisZ > maxZ) maxZ = thisZ;
        });

        $(".ui-widget-overlay").css("zIndex", (maxZ + 1));
        $dialog.parent().css("zIndex", (maxZ + 2));

        return this._super();
    }
});

Спасибо, как это, где я получил информацию от того, как это сделать: https://stackoverflow.com/a/20942857

http://learn.jquery.com/jquery-ui/widget-factory/extending-widgets/

Сэндвич мое звеном между модальный экран и диалог, Мне надо поднять элемент выше модально-экран, а потом поднять выше диалог моя стихия.

У меня был небольшой успех, выполнив следующие действия после создания диалога на элемент $ДЛГ.

$dlg.closest('.ui-dialog').css('zIndex',adjustment);

Поскольку каждое окно имеет разные стартовые Z-индекса (они постепенно увеличиваются) я делаю регулировка строку с повышением стоимости, как это:

const adjustment = "+=99";

Однако, jQuery и просто продолжает увеличивать свойства zIndex значение модального экрана, так что второй диалог, бутерброд уже не работал. Я сдался на UI-диалог на "режимный" и, сделал ее "ложные", и просто создал свой собственный модальный. Он имитирует jQueryUI точно. Вот это:

CoverAll = {};
CoverAll.modalDiv = null;

CoverAll.modalCloak = function(zIndex) {
  var div = CoverAll.modalDiv;
  if(!CoverAll.modalDiv) {
    div = CoverAll.modalDiv = document.createElement('div');
    div.style.background = '#aaaaaa';
    div.style.opacity    = '0.3';
    div.style.position   = 'fixed';
    div.style.top        = '0';
    div.style.left       = '0';
    div.style.width      = '100%';
    div.style.height     = '100%';
  }
  if(!div.parentElement) {
    document.body.appendChild(div);
  }
  if(zIndex == null)
    zIndex = 100;
  div.style.zIndex  = zIndex;
  return div;
}

CoverAll.modalUncloak = function() {
  var div = CoverAll.modalDiv;
  if(div && div.parentElement) {
    document.body.removeChild(div);
  }
  return div;
}

Добавить это перед вызовом диалогового окна

$( obiect ).css('zIndex',9999);

И удалить

 zIndex: 700,

из диалога

moveToTop это правильный путь.

Z-индекса не является правильным. Он изначально работает, но несколько диалогов будет продолжать плавать под одним вы изменили с помощью z-индекса. Ничего хорошего.

Собственность добавить свойства zIndex в диалоговом объекта:

$(elm).dialog(
 zIndex: 10000
);