Magnific Popup: открытие второго всплывающего окна с различными параметрами

Используя Magnific Popup, можно ли заставить второе всплывающее окно, открытое, пока первое, все еще открыто, принимать новые параметры? В документации указано следующее:

"Если всплывающее окно уже открыто - оно просто перезапишет содержимое (но старые параметры будут сохранены)".

Я открываю всплывающее окно, используя общедоступный метод open() в некотором JavaScript. У меня проблема в том, что мое первое всплывающее окно является модальным, поэтому к нему не добавлена ​​​​кнопка закрытия. Второе всплывающее окно не должно быть модальным, но поскольку оно использует параметры первого, а не свои собственные, оно является модальным.

Вот jsFiddle с проблемой: jsfiddle

Вот пример:

HTML

<div class="popup_dialog mfp-hide" id="modal_popup">
  <p>My modal popup</p>
</div>

<div class="popup_dialog mfp-hide" id="non_modal_popup">
  <p>My non modal popup, which should have a close button.</p>
</div>

CSS

.popup_dialog {
  background: none repeat scroll 0 0 #fff;
  border-radius: 3px;
  margin-left: auto;
  margin-right: auto;
  max-width: 500px;
  padding: 30px;
  position: relative;
}

.mfp-hide {
    display:none;
}

JavaScript

  $(document).ready(function () {
    // Open the first, modal popup
    $.magnificPopup.open({
      items: {
        src: $('#modal_popup')
      },
      type: 'inline',
      modal: true
    });

    // Open the second, non-modal popup
    setTimeout(function () {
      $.magnificPopup.open({
        items: {
          src: $('#non_modal_popup')
        },
        type: 'inline',
        modal: false,
        closeBtnInside: true
      });
    }, 2000);
  });

javascript jquery magnific-popup
person AGB    schedule 04.11.2014    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Вам нужно вызвать метод $.magnificPopup.close() перед открытием второго всплывающего окна, если вам это нужно с другими параметрами.

person Dmitry Semenov    schedule 08.11.2014
comment
Я пробовал это, но второе всплывающее окно так и не открылось. Я попытаюсь воспроизвести на jsfiddle и обновить вопрос. Кстати, отличный плагин, спасибо за его создание. - person AGB; 08.11.2014
comment
Причина, по которой метод закрытия не работал у меня изначально, заключалась в том, что для параметра removeDelay было установлено значение 300. Предположительно, к тому времени, когда метод смог закрыть всплывающее окно, второй уже был добавлен в DOM, и они оба были удаленный. - person AGB; 14.11.2014