Меню сайта
Полезное
- Пользователи оценят ваш сайт
- Оченки-ннада?
- Нужен персонал на сайт?
- Скрипты для uCoz
- Ваш сайт закрыли ?
Новые статьи
Категории
Мини-чат
[3]
Мини чаты для uCoz,a |
Меню
[22]
Разнообразные менюшки для сайта uCoz |
|
Опросы
[1]
Уникальные виды опросов для сайта uCoz.
|
|
Другое
[133]
Здесь вы найдете большое количество разных и уникальных скриптов для сайта uCoz.
|
|
Профиль
[1]
Скрипты профиля для сайта uCoz.
|
|
Ajax окна
[2]
Ajax окна для сайта uCoz.
|
|
Материалы
[2]
Виды материалов: файлов, новостей, блогов, статей, доски объявления, фотоальбомов и т.д.
|
|
Статистика сайта
[8]
Очень важные скрипты для сайта uCoz - Статистика сайта.
|
|
Состав клана
[0]
Скрипт состава клана, без этого скрипта ни один сайт не назовешь клановым!*
|
|
Друзья сайта
[3]
Друзья сайта, или партнерка. Всех размеров: 468х60;150х200;88х31 и др.
|
|
Статистика CW
[1]
Статистика CW для кланового сайта.
|
|
Комментарии
[1]
Внешний вид комментариев, или форма добавления.
|
|
Категории
[2]
Внешний вид категорий для сайта uCoz
|
|
Информеры
[11]
Большой количество информеров для сайта.
|
favicon
[9]
Иконки разных видов для сайта uCoz |
Soft для uCoz
[1]
Программы для сайтов uCoz |
Витрина ссылок
(Цена: 2 руб.)
Поставить к себе на сайт
Наши партнеры
Реклама на сайте
Патчи CS 1.6
Мини профиль
- 01.05.2024 - 06:05
Опрос сайта
Игровые новости
Онлайн лист
Лента комментариев
pasha19021995 написал в 01:10
yuriq написал в 18:19
warlikechildhq написал в 02:21
Infe[R]nos5529 написал в 17:25
Связь с админом
 |
 |
 |
Новое на сайте
-
- Популярные файлы
-
- Самые популярные темы
| Главная » Файлы » Раздел Ucoz » Информеры |
Информер - счётчик материалов (Бегущие цифры)
Многие наверное замечали на сайтах (Интернет магазинах), для наглядности интересный показатель каких либо данных в виде анимационных цифр. На главной странице сайта в отдельной таблице к примеру показывается сколько заказов выполнено, довольных клиентов, материалов в наличии и так далее.
Существует несколько вариантов скриптов, выбрал один из них на JSFiddle, решил переделать его под
информер счётчика материалов, набросал стилей, так как просто цифры скучновато выглядят.
Вообщем создаём информер в ПУ сайта: счётчик материалов (материалы) и меняем в нём код на этот:
Тут я конечно привёл пример, данные которые хотите видеть меняйте на свои, к примеру они указаны в коде по умолчанию информера.
Стили которые набросал тоже можно легко понять и переделать:
CSS
Ну и сам скрипт, в который уже вбил операторы ucoz отвечающие за вывод количество материалов.
Не забывайте тут тоже менять на свои, это пример.
0 - точка отсчёта, $LOAD$ - кол-во материалов каталога файлов, 8000 - скорость
Остаётся только поставить код информера типа $MYINF_1$ на страницу сайта.
Ну и добавлю в конце, заметил в HTML коде если выводить оператор несуществующего модуля то весь
скрипт не будет работать. [ Гостям запрещено скачивать файлы, зарегистрируйся или войди с профиля! ] [ Скриншот ] [ Гости не могут жаловаться на материалы! ] Метки:Напоминаем, что Администрация проекта не несет какую-либо ответственности за публикуемые пользователями материалы.. Все действия с файлом Вы совершаете на свой страх и риск.
Существует несколько вариантов скриптов, выбрал один из них на JSFiddle, решил переделать его под
информер счётчика материалов, набросал стилей, так как просто цифры скучновато выглядят.
Вообщем создаём информер в ПУ сайта: счётчик материалов (материалы) и меняем в нём код на этот:
Код
<div class="running">
<div class="container">
<div class="numbers">Файлы<br><?if($LOAD$)?><b id="example"></b><?endif?></div>
<div class="numbers">Фото<br><?if($PHOTO$)?><b id="example2"></b><?endif?></div>
<div class="numbers">Статьи<br><?if($PUBL$)?><b id="example3"></b><?endif?></div>
<div class="numbers">Новости<br><?if($NEWS$)?><b id="example4"></b><?endif?></div>
</div>
</div>
<div class="container">
<div class="numbers">Файлы<br><?if($LOAD$)?><b id="example"></b><?endif?></div>
<div class="numbers">Фото<br><?if($PHOTO$)?><b id="example2"></b><?endif?></div>
<div class="numbers">Статьи<br><?if($PUBL$)?><b id="example3"></b><?endif?></div>
<div class="numbers">Новости<br><?if($NEWS$)?><b id="example4"></b><?endif?></div>
</div>
</div>
Тут я конечно привёл пример, данные которые хотите видеть меняйте на свои, к примеру они указаны в коде по умолчанию информера.
Стили которые набросал тоже можно легко понять и переделать:
CSS
Код
.running {
text-align: center;
}
.container {
display: inline-block;
}
.numbers {
color: white;
font-size: 16px;
display: block;
float: left;
margin: 5px;
border-radius: 3px;
background: SteelBlue;
width: 105px;
height: 45px;
border: 1px solid LightGray;
box-shadow:0 5px 5px #000;
-moz-box-shadow:0 5px 5px #000;
-webkit-box-shadow:0 5px 5px #000;
}
text-align: center;
}
.container {
display: inline-block;
}
.numbers {
color: white;
font-size: 16px;
display: block;
float: left;
margin: 5px;
border-radius: 3px;
background: SteelBlue;
width: 105px;
height: 45px;
border: 1px solid LightGray;
box-shadow:0 5px 5px #000;
-moz-box-shadow:0 5px 5px #000;
-webkit-box-shadow:0 5px 5px #000;
}
Ну и сам скрипт, в который уже вбил операторы ucoz отвечающие за вывод количество материалов.
Не забывайте тут тоже менять на свои, это пример.
Код
<script type="text/javascript">
window.onload=function(){
function number_to(id,from,to,duration)
{
var element = document.getElementById(id);
var start = new Date().getTime();
setTimeout(function() {
var now = (new Date().getTime()) - start;
var progress = now / duration;
var result = Math.floor((to - from) * progress + from);
element.innerHTML = progress < 1 ? result : to;
if (progress < 1) setTimeout(arguments.callee, 5);
}, 5);
}
number_to("example",0,$LOAD$,8000);
number_to("example2",0,$PHOTO$,8000);
number_to("example3",0,$PUBL$,8000);
number_to("example4",0,$NEWS$,8000);
};
</script>
window.onload=function(){
function number_to(id,from,to,duration)
{
var element = document.getElementById(id);
var start = new Date().getTime();
setTimeout(function() {
var now = (new Date().getTime()) - start;
var progress = now / duration;
var result = Math.floor((to - from) * progress + from);
element.innerHTML = progress < 1 ? result : to;
if (progress < 1) setTimeout(arguments.callee, 5);
}, 5);
}
number_to("example",0,$LOAD$,8000);
number_to("example2",0,$PHOTO$,8000);
number_to("example3",0,$PUBL$,8000);
number_to("example4",0,$NEWS$,8000);
};
</script>
0 - точка отсчёта, $LOAD$ - кол-во материалов каталога файлов, 8000 - скорость
Остаётся только поставить код информера типа $MYINF_1$ на страницу сайта.
Ну и добавлю в конце, заметил в HTML коде если выводить оператор несуществующего модуля то весь
скрипт не будет работать. [ Гостям запрещено скачивать файлы, зарегистрируйся или войди с профиля! ] [ Скриншот ] [ Гости не могут жаловаться на материалы! ] Метки:
Советую посмотреть эти файлы!
| Всего комментариев: 0 | |
