Файлы Скрипты и модификации

Знаки отличия на персональной странице uCoz

Описание:
Ранее на известном сайте Center-DM предлагалась целая стенка из наград, которые как бы нужно разблокировать, некий квест. Идея даже интересная, но наш вариант представляет собой монументальные знаки отличия, пользователь за небольшое время может собрать 5 штук и успокоиться. Сделали новый скрипт по аналогии с нашими наградами на Урааа, только добавили анимацию при наведении.

Установка
Вставьте код на персональную страницу пользователя в том месте где хотите видеть знаки отличия:
Код
<div class="signsOver">  
<?if($_LOAD_ENTRIES$>0)?><div class="signOne sLoad"><span><i>Знак выдается за первый файл</i></span></div><?endif?>  
<?if($_COM_ENTRIES$>0)?><div class="signOne sComments"><span><i>Знак выдается за коммен-<br>тарии</i></span></div><?endif?>  
<?if($_FORUM_ENTRIES$>0)?><div class="signOne sForum"><span><i>Знак выдается за активность на форуме</i></span></div><?endif?>  
<?if($_REPUTATION$>0)?><div class="signOne sReputation"><span><i>Знак выдается за хорошую репутацию</i></span></div><?endif?>  
<?if($_AVATAR$)?><div class="signOne sAvatar"><span><i>Знак выдается за установку аватара</i></span></div><?endif?>  
<?if($_EMAIL_IS_VERIFIED$)?><div class="signOne sProtect"><span><i>Знак выдается за подтверж-<br>денный<br>E-Mail</i></span></div><?endif?>  
</div>  

<style type="text/css">  
.signsOver {width:100%;}  
.signsOver * {transition: all linear .2s; -moz-transition: all linear .2s; -webkit-transition: all linear .2s; -o-transition: all linear .2s;}  
.signOne {display:inline-block;width:100px;height:100px;position:relative}  
.signOne:hover span {opacity:1;margin-top:0px}  
.signOne span {opacity:0;margin-top:20px;cursor:help;width:100%;height:100%;top:0;left:0;position:absolute;background:rgba(0,0,0,0.7);color:#FFF;font-size:11px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}  
.signOne span i {font-style:normal;padding:10px;display:block}  
.sLoad {background:url('http://yraaa.ru/_pu/25/63354628.png') center no-repeat}  
.sComments {background:url('http://yraaa.ru/_pu/25/45575411.png') center no-repeat}  
.sForum {background:url('http://yraaa.ru/_pu/25/47909650.png') center no-repeat}  
.sReputation {background:url('http://yraaa.ru/_pu/25/32575082.png') center no-repeat}  
.sProtect {background:url('http://yraaa.ru/_pu/25/45136495.png') center no-repeat}  
.sAvatar {background:url('http://yraaa.ru/_pu/25/15996736.png') center no-repeat}  
</style>

Рекомендуется загрузить изображения в стилях на свой сайт, а стили поместить в ваш CSS-файл.
Источник: yraaa.ru
Материал «Знаки отличия на персональной странице uCoz» ещё никто не комментировал.
Добавлять комментарии могут только зарегистрированные пользователи.
Войдите на сайт или Зарегистрируйтесь
Наш опрос
Лучшая бесплатная CMS это...
1330 ответов
Архив
Статистика
Онлайн всего: 1
Гостей: 1
Пользователей: 0
Никого нету
Сегодня нас посетили
Никто ещё не посетил
© 2012 – 2024 «For-uCoz». Made with by Snoopak Хостинг от uCoz
Внимание! На сайте ведутся технические работы.
Некоторые изображения и файлы могут быть недоступны