Решение, как показать модальное окно, когда посетитель пришёл на сайт первый раз. Например через 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)