Файлы Авторство For-uCoz

Новый вид онлайн статистики для uCoz

Описание:
Недавно на форуме пользователь с ником Vovanchikus13 обратился с вопросом "возможно ли вот так преобразовать старую и унылую онлайн статистику". Ну и от нефиг делать xD я взялся за реализацию. Описывать не вижу смысла т.к. на постере и так все видно.
И так приступим к установке:
1. Для начала установим CSS. Просто вставьте следующий код в конец своего CSS:
Код
/* Новый вид онлайн статистики by Snoopak */
  .item {
  text-align: center;
  float: left;
  margin: 10px;
  }
   
  .num {
  background: #fff;
  border: 3px solid;
  border-radius: 50%;
  line-height: 50px;
  width: 50px;
  margin: auto;
  text-align: center;
  }
   
  #tnum {border-color: #222;}
  #unum {border-color: #008000;}
  #gnum {border-color: #d6d6d6;}
  /* ------------- */

2. Далее установим html разметку нашей онлайн статистики. Найдите у себя $ONLINE_COUNTER$ и замените на:
Код
<div class="item total">
  <div id="tnum" class="num"></div>
  Всего
  </div>  
  <div class="item users">
  <div id="unum" class="num"></div>
  Пользователи
  </div>
  <div class="item guests">
  <div id="gnum" class="num"></div>
  Гости  
  </div>
  <div style="display:none;">$ONLINE_COUNTER$</div>
  <script type="text/javascript">
  $('#tnum').text($('#onl1 b').text());
  $('#gnum').text($('#onl2 b').text());
  $('#unum').text($('#onl3 b').text());
  </script>

Вот и все, на этом установка завершена)

Настройка
Для того, чтоб изменить цвета обводки кругов, в css заменяем цвета на свои, а именно border-color.
Также можно изменить и размеры кругов. В общем если, что-то не ясно, пишите в комментариях и мы поможем)
Копирование данного материала без указания автора и обратной ссылки строго запрещено
Источник: for-ucoz.ru
Загрузка данных...
0 комментариев
Материал «Новый вид онлайн статистики для uCoz» ещё никто не комментировал.
Добавлять комментарии могут только зарегистрированные пользователи.
Войдите на сайт или Зарегистрируйтесь
© 2012-2017 «For-uCoz». Дизайн и верстка Snoopak Хостинг от uCoz