Всплывающее окно без jQuery плагинов

Задача:

Как сделать модальное окно на чистом JavaScript без использования jQuery плагинов


Решение:
1 Подключить файлы
<script src="index.js"></script> <link rel="stylesheet" href="css.css">
2 Инициализация
<script>const modal = new VanillaModal()</script>
3 Ссылка (кнопка)
<a href="#modal-1" rel="modal:open">One Prodigious Cat</a>
4 Контент
<div id="modal-1" style="display:none"> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam itaque aperiam porro temporibus saepe pariatur ad, asperiores cumque recusandae provident aliquam nulla, ex, explicabo eos suscipit culpa sapiente nesciunt quas! </div> 
5 Построение окна
<div class="modal"> <div class="modal-inner"> <a rel="modal:close">&times;</a> <div class="modal-content" id="modal-1">33</div> </div> </div>
Похожие решения:
Изменено: 07 12 2017
Просмотров: 1032

Комментарии

Написать