У вас няма доступу да гэтай старонцы. Калі вы не прайшлі ідэнтыфікацыю, то зрабіце гэта - Увайсці
Усплывальныя вокны
Всплывающее окно может содержать текст, содержимое html блока, загрузку iframe (youtube или данные других сайтов) или ajax данные (ajax данные со страниц или статей вашего сайта).
Инструкция:
Используя код ниже, будет вызвано всплывающее окно.Code: html
<a class="hotengine-script-popup" target="blank" data-iframe="2" data-width="0" data-height="0" data-auto-width="320" data-auto-height="320" data-max-height="500" data-max-width="750" data-mobile-width="768" data-header-fix="0" data-title="Пример окна" href="https://www.youtube.com/embed/T9zuAxr1Wfg?rel=0&autoplay=1">Текст кнопки</a>
В параметрах ссылки можно указать следующие параметры:
- data-iframe (тип загружаемых данных)
- 2 - Frame полный путь url (например для загрузки youtube)
- 3 - ID или Class со страницы (блок с ID или Class'ом нужно предварительно создать на странице)
- 4 - Frame с данными страницы "p" (для использования страниц сайта)(например /ajax.php?p=путь href)
- 5 - Frame с данными карточки товара "shop_cat_p" (например /ajax.php?shop_cat_p=путь href) в которой можно указывать полный путь к странице карточки товара
- 1 - Frame с данными страницы каталога статей, передает GET переменную "blog_cat_p" (например /ajax.php?blog_cat_p=путь href) в которой можно указывать полный путь к статье
- 11 - HTML данные страницы каталога статей, передает GET переменную "blog_cat_p" (например /ajax.php?blog_cat_p=путь href) в которой можно указывать полный путь к статье
- 14 - HTML данные страницы "p" (для использования страниц сайта)(например /ajax.php?p=путь href)
- 15 - HTML данные карточки товара "shop_cat_p" (например /ajax.php?shop_cat_p=путь href) в которой можно указывать полный путь к странице карточки товара
- data-width - ширина окна
- data-height - высота окна
- data-auto-width - автоматическая ширина окна (значение указывает минимальную возможную ширину)
- data-auto-height - автоматическая высота окна (значение указывает минимальную возможную высоту)
- (автоматическая ширина и высота имеет больший приоритет чем изначальное значение ширины и высоты)
- data-max-width - максимальная ширина окна
- data-max-height - максимальная высота окна
- data-mobile-width - ширина мобильного окна (если окно меньше указанного размера, то для него устанавливается указанное значение ширины)
- data-title - Заголовок окна
- href или data-href - путь открываемой страницы или get переменной
- data-close-button - текст кнопки закрытия окна (отображается только если указано значение)
- data-unset-height - Удалиь стиль высоты контента внутри окна (дополнительный атрибут устраняющий лимит по высоте блока с контентом внутри окна) data-unset-height="1"
- data-header-fix - Зафиксировать заголовок окна
- data-close-overlay - Включить/Выключить закрытие окна при нажатии на область за ее пределами (дополнительный атрибут. Значения: «1» (включить), «0» (выключить)). По умолчанию - Включено (если не указано).
data-micromodal-close - Атрибут для закрытия открытого окна. Можно разместить в любом месте в контенте, который загружается внутри окна.
data-dialog-callback - Атрибут
data-dialog-callback позволяет указать имя функции, которая вызовется после открытия всплывающего окна.
Пример
Code: html
<a href="#" class="hotengine-script-popup" data-dialog-callback="myCustomFunction">Открыть</a>
<script>
function myCustomFunction() {
console.log("Callback выполнен!");
}
</script>
data-dialog-button-callback - Атрибут
data-dialog-button-callback позволяет указать коллбек-функции для кнопок всплывающего окна. Формат: Название кнопки:callbackFunctionBtn, разделяем несколько кнопок запятой. Функции могут быть определены как до открытия окна, так и после — они будут вызываться при клике на кнопку, если функция существует.
Пример
Code: html
<a href="#" class="hotengine-script-popup" data-dialog-button-callback="Ok:callbackFunctionBtn1">Открыть</a>
<script>
window.callbackFunctionBtn1 = function() {
console.log("Нажата кнопка Ок");
};
</script>
Пример стиля CSS, который фиксирует несколько кнопок в нижней области всплывающего окна с добавлением подложки.
Пример
Code: CSS
#dialog_hotengine_script_popup .modal__container {
display: flex;
flex-direction: column;
max-height: 95vh;
}
#dialog_hotengine_script_popup .modal__content {
overflow-y: auto;
flex: 1 1 auto;
padding-bottom: 60px;
}
#dialog_hotengine_script_popup .modal__footer {
position: absolute;
bottom: 0;
left: 0;
width: calc(100% - 40px);
background: #fff;
padding: 10px 20px;
box-shadow: 0 -2px 5px rgba(0,0,0,0.1);
z-index: 10;
display: flex;
justify-content: flex-start;
}
#dialog_hotengine_script_popup .modal__btn {
min-width: 80px; background: #0078d1;
color: #fff;
padding: 6px 14px;
}
Пример всплывающего окна с Youtube видео:
Code: html
<a class="hotengine-script-popup" target="blank" data-iframe="2" data-width="0" data-height="0" data-auto-width="320" data-auto-height="320" data-max-height="500" data-max-width="750" data-mobile-width="768" data-title="Пример окна" href="https://www.youtube.com/embed/T9zuAxr1Wfg?rel=0&autoplay=1">Текст кнопки</a>
Результат: Текст кнопки
Пример кода Таму