Несколько окон, кнопка «Назад» и цепочки окон
XPopup поддерживает открытие нескольких окон в одном боксе. Можно создавать цепочки окон, где каждое следующее открывается поверх предыдущего. Кнопка «Назад» позволяет вернуться к родительскому окну.
Второе окно поверх первого (boxId) #
Опция boxId открывает окно в отдельном боксе.
Два бокса существуют параллельно — закройте верхний, нижний останется.
Окна в разных боксах не связаны цепочкой, кнопка «Назад» отсутствует.
Несколько независимых боксов #
Три бокса с разными boxId и разными скинами.
Откройте все три — они существуют параллельно.
Закрытие одного не влияет на остальные.
Изолированный бокс с цепочкой окон #
В отдельном боксе (boxId: 10) открывается цепочка из трёх окон.
Кнопка «Назад» работает внутри бокса. Основной бокс (без boxId) не затрагивается.
Цепочка из двух окон #
Откройте первое окно. Внутри него нажмите кнопку, чтобы открыть второе окно поверх первого. Во втором окне появится кнопка «Назад» для возврата.
Цепочка из трёх окон (пошаговый мастер) #
Три окна последовательно. Кнопка «Назад» позволяет вернуться на шаг назад. Кнопка «Закрыть» в любом окне закроет всю цепочку.
Попробуйте: откройте все три окна и нажимайте «Назад» для пошагового возврата.
Модальная цепочка (нельзя закрыть кликом на фон) #
Все окна в цепочке модальные (modal: true).
Их нельзя закрыть кликом на фон или клавишей Esc — только через кнопки.
Кнопка «Назад» в разных скинах #
Кнопка «Назад» автоматически подстраивается под цветовую схему скина. Сравните, как она выглядит в разных скинах.
Запрет родительства: canBeParent #
Опция canBeParent: false запрещает окну становиться родителем.
Окно, открытое из такого окна, не будет иметь кнопки «Назад».
Сравните: первая кнопка — обычная цепочка, вторая — родительство запрещено.
Программное управление окнами #
Методы $.xpopup для программного управления.
$.xpopup.close()— закрыть все боксы$.xpopup.close('win')— закрыть текущее окно (вернуться к родителю)$.xpopup.close('box')— закрыть текущий бокс$.xpopup.close({objType:'win', objCount:2})— закрыть 2 последних окна$.xpopup.back()— программно нажать «Назад»$.xpopup.isOpen()— проверка, открыт ли попап