Если хотим, чтоб мы обращались к одному экземпляру попап, то создать одну глобальную переменную, либо через var свои экземпляры
window.globalPopup = new Popup(); // инициализация попап
Попап имеет методы:
options - должен вызываться первым
globalPopup.options({ clearClose: true, // Очищаем контейнер после закрытия попап bodyHidden: true, // Убирает скролл у тега <body> addClassNamePopup: 'dopclass', // Дополнительный класс добавляем контейнеру попапа, который будет удаляться при закрытии попап, по умолчанию он пустой closeShow: true, // Скрываем, либо показываем кнопку закрытия closeOverlay: true, // Закрытие попап при клике по заднему фону background: '', // По умолчанию цвет прописан в файле popup.less, но можем динамически изменить цвет closeButtons: '', // Тут можно дополнительно назначить кнопки закрытия, используем селекторы, можно несколько через запятые, пример: closeButtons: '.block, #element' coordElement: '' // Здесь можно прописать селектор, над которым всплывет попап, только один элемент offsetY: 0, // Смещение от левого верхнего угла относительно элемента coordElement offsetX: 0, // Смещение от левого верхнего угла относительно элемента coordElement }).html(response).show();
html - Вставляем что-либо в попап
globalPopup.html(response); // Вставляем что-либо в попап globalPopup.html(response, function() { // Имеет callback});
append - Добавляем что-либо в попап
globalPopup.append(response); // Добавляем что-либо в попап globalPopup.append(response, function() { // Имеет callback});
show - Этот метод выводит попап, иначе ничего не увидете
globalPopup.show(); globalPopup.show(function() { // Имеет callback});
close - Если нужно закрыть попап, по умолчанию закрывает крестик и клик по фону
globalPopup.close(); globalPopup.close('clear', function() { // 'clear' - очищает контейнер и имеет callback});
clear - Очищаем содержимое попап
globalPopup.clear();
loader - Индикатор подгрузки
globalPopup.loader(true); globalPopup.loader(false);