Всплывающее окно при первом посещении сайта

26/06/2017 05:41

Если, при первом посещении сайта, требуется показать посетителю любую информацию во всплывающем модальном окне - то этот скрипт для вас. Для реализации этого будет использоваться jQuery и плагин arcticModal.

Установка:
1. Распаковать содержимое архива в папку с шаблоном и подключить его. Если на вашем сайте не подключен jQuery, добавить между тегами:

<head></head>

Следующий код:

<!-- jQuery -->
<script src="//yandex.st/jquery/1.9.1/jquery.min.js"></script>

Если jQuery уже подключен, то добавить только это:

<!-- arcticModal -->
<script src="{THEME}/js/arcticmodal/jquery.arcticmodal-0.3.min.js"></script>
<link rel="stylesheet" href="{THEME}/js/arcticmodal/jquery.arcticmodal-0.3.css">

<!-- arcticModal theme -->
<link rel="stylesheet" href="{THEME}/js/arcticmodal/themes/simple.css">

<script>  
(function($) {  
$(function() {  
  
  // Проверим, есть ли запись в куках о посещении посетителя  
  // Если запись есть - ничего не делаем  
  if (!$.cookie('was')) {  
  
      // Покажем всплывающее окно  
      $('#boxUserFirstInfo').arcticmodal({  
          closeOnOverlayClick: false,  
          closeOnEsc: true  
      });  
  
  }  
  
  // Запомним в куках, что посетитель к нам уже заходил  
  $.cookie('was', true, {  
      expires: 365,  
      path: '/'  
  });  
  
})  
})(jQuery)  
</script>

2. Для вывода всплывающего окна с информацией для пользователя, между тегами:

<body></body>

Добавить:

<div style="display: none;">  
  <div class="box-modal" id="boxUserFirstInfo">  
      Приветствуем Вас, посетитель!

        У нас собрано много интересной и очень полезной информации.
        Надеемся, Вам понравится на нашем сайте!
    </div>  
</div>

Готово!

jquery_arcticmodal-0_3.zip

Создайте аккаунт или авторизуйтесь для скачивания

• Автор: Dimox
• Источник

Oxigen
0
2.5K