Всем привет! как вы знаете сейчас на всех сайтах практически стоят уведомления о том что сайт использует cookies и пользователь должен согласится с этим и после окошко скрывается
Так вот я решил предложить свой вариант такого блока уведомления
по суте н не отличается от большинства скриптов такого рода просто я его сделал боле привлекательным так как на сайтах где я их видел они просто портят дизайн и вызывают желание закрыть данный сайт так же сразу скажу что данный блок не имеет фиксированного места положения и будет оставаться там где вы его поставите тем самым не будет надоедать пользователям
Установка
Скопируйте код ниже и вставьте его в то место где хотите видеть данное уведомления
Код
<script type="text/javascript">
$(document).ready(function(){
$("#setCookie").click(function () {
$.cookie("popup", "24house", {expires: 0} );
$("#bg_popup").hide();
});
if ( $.cookie("popup") == null ){$("#bg_popup").show();}
else { $("#bg_popup").hide();}
});
</script>
<div id="bg_popup" style="display: none;">
<div id="popup">
<a id="setCookie" class="closeCooki" href="#" title="Согласиться и Закрыть" onclick="document.getElementById('bg_popup').style.display='none'; return false;">Согласиться</a>
<div class="cont_bc">
Этот сайт использует файлы cookies для более комфортной работы пользователя. Продолжая просмотр страниц сайта, вы соглашаетесь с <a href="ССЫЛКА НА СТРАНИЦУ С ПРАВИЛАМИ">Политикой использования файлов cookies</a>.
</div>
</div>
</div>
Текст меняем на свой и не забываем указать ссылку на страницу с описанием правил.
Теперь нам нужно подключить стили блока для этого копируем код ниже и вставляем его в таблицу стиле в самый конец
Код
#bg_popup{
position: relative;
background: #333 url("../img/zz.png") no-repeat center;
color: #FFF;
width: 100%;
padding: 15px;
padding-right: 150px;
}
#setCookie {
position: absolute;
top: 0;
bottom: 0;
margin: auto 0;
right: 30px;
color: #FFF;
display: inline-block;
background: rgba(0,0,0,.1);
padding: 0px 15px;
line-height: 30px;
height: 30px;
border-radius: 20px;
}
#setCookie:hover {background: rgba(0,0,0,.3);}
.cont_bc {max-width: 900px;}
.cont_bc a {
color: #FFF;
font-weight: bold;
text-decoration: underline;
}
Отлично не забываем сохранить!
Обратите внимание на вот эту строчку в коде выше
Цитата
background: #333 url("../img/zz.png") no-repeat center;
Данная строчка отвечает за фон блока
#333 цвет фона
url("../img/zz.png") фоновое изображение ( звёздочки ) можно поменять на свои или просто удалить
Теперь подключим файл
cookies Для этого вам нужно скачать архив и загрузить всё что там есть к себе в файловый менеджер
Картинку в папку
img Скрипт jquery.cookie в папку
js За тем добавить на все страницы перед закрывающим тегом /body вот такою строчку
можно и в глобальный блок нижняя часть
Код
<script src="/js/jquery.cookie.js"></script>
Отлично не забываем сохранить а так же скачать архив и загрузить его к себе если вы всё сделали то вам нужно
по чистим кеш и куки в браузере что бы увидеть результат
waak 
web_master 
