Информационные таблички
1531
9.4 из 10
Проголосовало: 14
Проголосовало: 14
- Скачать с сервера
- Скачать
Всем доброго времени суток друзья!
Решил поделится скриптом. Смысл данного скрипта очень прост - данный скрипт выводит ту или иную информацию в виде разноцветных таблиц на сайте , которую вы друзья захотите донести до своих пользователей. данный скрипт легко приспособить и под другие действия . Например можно выводить информеры , рекламные посты и т.д да что угодно. Как говорится на что хватит вашей друзья фантазии. Данный скрипт так же можно настроить чтоб он выводил информацию в разных временных периодов, все зависит так же от вашей фантазии. Данный скрипт я нашел в сети и не являюсь его автором, выглядел он весьма иначе. Я просто его переделал.
Ну вот и сам скрипт.
Первое что мы делаем это добавляем данный скрипт в верх нашей страницы между тегами: <head></head>
JS-код:
Код
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
далее так же между тегами: <head></head>
JS-код:
Код
<script type="text/javascript">
$(document).ready(function(){
$("#setCookie").click(function () {
$.cookie("popup", "", {expires: 0} );
$("#bg_popup").hide();
});
if ( $.cookie("popup") == null )
{
setTimeout(function(){
$("#bg_popup").show();
}, 1000)
}
else { $("#bg_popup").hide();
}
});
</script>
Сделали!? Идем дальше и устанавливаем сам код с помощью которого и будет все выводится. В любое место где вы хотите чтоб выводилась информация.
HTML-код:
Код
<div id="bg_popup">
<div id="popup">
<a id="setCookie" class="close" href="#" title="Закрыть" onclick="document.getElementById('bg_popup').style.display='none'; return false;"></a>
<div class="wTitle">тут ваш название</div>
<div class="wText">тут ваше сообщение</div>
</div>
</div>
Установили!?) Отлично! Двигаемся дальше.
Далее идут стили,немало важнейший момент в данном деле ведь от стилей и будет зависеть как будет выглядеть ваша сообщение.
на моем сайте стили представлены в таком формате.
CSS-код:
Код
#bg_popup{
display: none;
}
#popup {
border: 1px solid #deb7b7;
background-color: #fde9e9;
padding: 8px 11px;
margin: 0px;
color: #281b1b;
border-radius: 1px;
}
.close{
background-image: url('http://webo4ka.ru/Ucoz8/gtk-close.png');
background-size: 100% 100%;
width: 18px;
height: 18px;
float:right;
margin: -2px -7px 0px 0px;
opacity: 0.5;}
.wTitle {
color:#3793cc;
font-size:14px;
line-height:14px;
}
.wText {
color:#454545;
font-size:12px;
text-align:justify;
}
.close:hover {
opacity: 1.0;
cursor: pointer;
}
Настроили стили, идем дальше...
В самый конец нашей страницы перед тегам </body>
вставляем еще один скрипт.
JS-код:
Код
<script src="http://webo4ka.ru/Ucoz8/soc-info.js"></script>
Ну вот и все. информационные таблички установлены.
Ну а теперь давайте разберем как же настроить временной период сообщения.
Данный скрипт
JS-код:
Код
<script type="text/javascript">
$(document).ready(function(){
$("#setCookie").click(function () {
$.cookie("popup", "", {expires: 0} );
$("#bg_popup").hide();
});
if ( $.cookie("popup") == null )
{
setTimeout(function(){
$("#bg_popup").show();
}, 1000)
}
else { $("#bg_popup").hide();
}
});
</script>
Может выводит информацию как и раз в сутки при закрытии которого сообщение появится вновь спустя 24 часа поминутно и дням.
Данная строка отвечает за время появления сообщения на сайте.
Код
$.cookie("popup", "24house", {expires: 0} );
На данный момент сообщение появится при закрытии через 24 часа. 24house
Если нужно больше, то просто измените в строке значения, например на 3 дня:
Код
$.cookie("popup", "3", {expires: 3} );
Для тех, кому нужно не в днях, а в минутах, то строку $.cookie("popup", "24house", {expires: 0} ); нужно заменить на вот такие три строки:
Код
var date = new Date();
date.setTime(date.getTime() + (60 * 1000));
$.cookie("popup", "", {expires: date} );
60 * 1000 - это одна минута, 60 * 3000 - это три минуты, ну и так далее.
Также в скрипте есть значение 1000 - это миллисекунды и равно все это 1 секунде. Это время задержки появления сообщения. По нужде меняете и сообщение появится в нужный момент.
Вот и все)
Автор публикации: Загрузка
Загрузка
- Всего комментариев: 1
0
|
как раз недавно спрашивали про таблички такие на куках))
Скрипт хороший! |
- Оставить комментарий:
Меню сайта
Категории
Мини-чат
Последние комментарии
Это моя работа, которая велась давольно таки давно 
Времени было мало, поэтому я скачал полностью все, что было и сделал архив 
Времени было мало, поэтому я скачал полностью все, что было и сделал архив 
Последние темы
Опрос
Статистика
| 0 онлайн |
0 наших |
0 чужих |
0
Сегодня были
Топ пользователей:
| |  |  |  |  |  |
 |  |  |  |  |  |
- Обратная связь
- Правила
- RSS
- +18
- Мобильная версия
- Хостинг от uCoz
- Copyright - webo4ka.ru © 2010-2025 г.
- Design by Вовчик Администратор:)