Решение, как показать модальное окно, когда посетитель пришёл на сайт первый раз. Например через 5 минут.
Условия:
- Посетитель пришёл первый раз (проверяем Cookie);
- Окно появляется через определённый промежуток времени, например через 5 минут;
- Обязательное наличие кнопки с надписью «Больше не хочу видеть это окно»
- При закрытии окна, больше его не показывать этому пользователю (записываем в Cookie)
Решение:
1 Подключить следующие плагины:
<script src="http://yastatic.net/jquery/2.1.4/jquery.min.js"></script> <script src="http://yastatic.net/jquery/cookie/1.0/jquery.cookie.min.js"></script>2 Контейнер всплывающего окна
<div id="popup-first-visit"> <div class="underlay"></div> <div class="modal"> <div class="modal-title"> <h3>Заголовок окна!</h3> </div> <div class="modal-body"> <form action=""> ... Содержание формы ... </form> </div> <div class="modal-footer"> <p>Больше не хочу видеть это окно</p> </div> </div> </div>3 JS код инициализации
<script> // Если нет куки HideModal if(!$.cookie('HideModal')) { // Покажем окно с id="popup-first-visit" через 300000 миллисекунд setTimeout("document.getElementById('popup-first-visit').style.display='block'", 300000); // Установим куки HideModal, не показывать окно в течении 365 дней $.cookie('HideModal', true, { expires: 365, path: '/' }); } </script>
Похожие решения:
Комментарии (0)