10 месяцев назад
История
README.md
kcmodal
С чего начать?
Подключите стили и скрипт
<link rel="stylesheet" href="css/KCModal.min.css">
<script src="js/KCModal.min.js"></script>
Пример использования
function openModal(){
KCModal.open({
title:'Модальное окно', // заголовок окна
content:document.querySelector('#callback').innerHTML, // HTML содержимое
class:'my-class', // дополнительные классы
});
}
Параметры открытия модального окна.
| Параметр | По-умолчанию | Описание |
|---|---|---|
| id | false |
(false/string) ID окна если false то будет сгенерирован автоматически |
| title | false |
(false/string) Заголовок окна, если false то не будет добавлен |
| content | string |
(string) содержимое окна |
| class | false |
(false/string) установка дополнительных классов на окно |
| timeout | 300 |
(int) число миллисекунд между началом анимации закрытия окна и удалением его из html |
| scrollBody | false |
(true/false) если false, то отключает скролл когда модальное окно активно |
| scrollOff | [] |
(array) массив классов внутри контента на которых еще нужно блокировать скролл |
События
При иницилизации можно передать свои собственные функции для кастомизации под ваши задачи.
'events':{ //события
'onBeforeRender':function(){}, //перед рендером окна
'onAfterRender':function(){}, // после рендера окна
'onBeforeResize':function(){}, //перед изменением размера экрана
'onAfterResize':function(){}, // после изменения размера экрана
}
Конвейеры
0 успешных
0 с ошибкой