Категории раздела
Вёрстка шаблонов [2]
Шаблоны [1]
Скрипты [4]
Партнёры сайта
Zone-CS.Ru - Проект игровых серверов
Проект игровых серверов по Counter Strike 1.6
ZorNet: Создание сайта на uCoz
На сайте найдете интересные решения по созданию сайтов
Nk-CS.Ru - Все для вашего портала uCoz
Огромный выбор файлов и статей о бесплатном хостинге ucoz.
Стать партнёром
Вы тоже можете стать нашим партнёром.
Статистика сайта

Рейтинг@Mail.ru
  • Всего тем на форуме: 247
  • Шаблонов: 7
  • Файлов: 298
  • Статей: 37
  • Всего пользователей: 988
  • За месяц: 506
  • Всего
    Юзеров
    Гостей
    Онлайн всего: 2
    Гостей: 2
    Пользователей: 0

    Сегодня авторизовались

    DESTEQ, Harvus, DegSTer, CEREBRUM, keter, Infe[R]nos, Falcon_pro, VIP, hujns, dieppl, volkkombo, roker1507, nikitamoroz95, dima-73rus, dgon, peityasmirnov, pospelovat96, mrshievchienko2006, aleksandr622, romanikitin05
    Горизонтальный топ пользователей по репутации для uCoz

    Горизонтальный топ пользователей по репутации для uCoz


    Информер горизонтальный топ пользователей который показывает юзеров по репутации, от того у кого больше всех репутации на сайте, до того у кого меньше. Топ пользователей по репутации.

    Топ пользователей по репутации как на RootGames.Ru на данный момент, пример можете увидеть в персональной странице пользователя в самом низу на нашем сайте.
    Подойдет как для светлых, так и для тёмных дизайнов, если слегка изменить стили.
    При наведении на аватарку пользователя она прокручивается.
    Красиво будет смотреться в персональной странице пользователя или на форуме.

    Сам по себе информер расположен горизонтально и по размерам он достаточно большой, но это можно легко исправить с помощью CSS.

    Установка:
    Создаём информер - [ Пользователи · Материалы · Репутация · Материалы: 8 · Колонки: 8 ]

    Где Материалы - кол-во пользователей которые будут высвечиваться в топе.
    Колонки выставляем столько же, сколько и материалов для корректного отображения.

    В сам шаблон информера вставляем следующий код:
    Код
    <div class="rg-top-user"> <a href="$PROFILE_URL$" title="Профиль пользователя"> <div class="rg-top-user-ava"><img src="<?if($AVATAR_URL$)?>$AVATAR_URL$<?else?>/designs_4/no-avatar-2017.png<?endif?>"><span title="репутация пользователя">$REPUTATION$</span></div> </a> <a href="$PROFILE_URL$" class="rg-top-user-name"><b>$USERNAME$</b></a> <span>$GROUP_NAME$</span> </div>


    Добавляем стили в таблицу стилей CSS:
    Код
    .rg-top-user { margin: 5px 0; text-align: center; } .rg-top-user span { font-size: 12px; display: block; margin: 5px 0 0 0; } .rg-top-user-ava { border-radius: 50%; width: 80px; height: 80px; position: relative; margin: 0 auto; margin-bottom: 15px; } .rg-top-user-ava span { position: absolute; background: #fffdfd; border-radius: 100%; border: 1px solid #e4e4e4; padding: 10px; color: #222122; width: 16px; height: 16px; font-size: 14px; top: -5px;  right: -10px; font-weight: bold; } .rg-top-user-ava img { border: 1px solid #e4e4e4; padding: 2px; opacity: .7; transition: .8s; border-radius: 50%; width: 80px; height: 80px; } .rg-top-user-ava img:hover { opacity: 1; -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); border-color: #f96c04; } .rg-top-user-name { background: #f1f1f1; padding: 3px 7px; border-radius: 3px; transition: .2s; margin: 0 0 0 5px; text-decoration: none !important; } .rg-top-user-name:hover { background: #f96c04; color: #fff !important; }


    И вставляем код информера $MYINF_#$ в нужное вам место.
    Готово.

    Источник: rootgames.ru


    Всего комментариев: 0
    Имя *:
    Email *:
    Код *: