Приветствую вас! Вы находитесь на сайте uCobest.my1.ru. Наш сайт посвящен тематике Система uCoz и Всё для DataLife Engine . Вы можете скачать обсолютно любой файл, который вам понравиться. На нашем сайте вы можете найти все что нужно для создания сайта, его дизайна и не только. На нашем сайте установлен оригинальный дизайн и расположение блоков и модулей где вы без труда найдете что искали. И не забываем про активный форум где вам всегда помогут если у вас возникнут вопросы. В мини чате только краткое общение, обсуждение и помощь идет на форуме, где созданы для этого разделы. Дерзайте ;)
19.11.2017, 09:29
ser2010
ser2010 (Администраторы)
  • Репутация: 0
  • Файлы: 240
Хината
Хината (Проверенные)
  • Репутация: 0
  • Файлы: 1
de3ertir
de3ertir (Пользователи)
  • Репутация: 0
  • Файлы: 0
19.11.2017 в 09:29Плавающий мини-профиль для uCoz
Описание:
Очень красивый, стильный, плавающий, "фиксированный" мини-профиль Вашего пользователя! Скрипт выполнен по все современным нормам, HTML и CSS3, с использованием иконочных шрифтов Fontawesome.

После того, как пользователь зайдет на Ваш сайт, в правом, нижнем углу он увидит кнопочку меню, после наведения на нее, выскочит функционал, связанный с пользователем. В это функционал входит: кнопка выхода, настройки профиля, автарка пользователя, личные сообщения. В скрипте еще добавлены два блока: группа пользователя и подписких, их вы можете убрать.

Установка:

Код
.menu_br {  
  position: fixed;  
  bottom: 0px;  
  right: -15px;  
  }  

  .absolute-center {  
  position: absolute;  
  top: 0;  
  left: 0;  
  bottom: 0;  
  right: 0;  
  margin: auto;  
  width: 20px;  
  height: 20px;  
  text-align: center;  
  font-size: 18px!important; color: #fff;  
  }  
  .menu_drop {  
  position: absolute;  
  bottom: 15px;  
  right: 30px;  
  }  
  .menu_list {  
  margin: 0 0 20px;  
  padding: 0 0 0 0px;  
  list-style: none;  
  opacity: 0;  
  transition: opacity .2s ease-out;  
  display: none;  
  }  
  .menu_drop:hover .menu_list {  
  opacity: 1; display:block;  
  }  
  .menu_item {  
  position: relative;  
  width: 40px;  
  height: 40px;  
  margin: 15px 0;  
  cursor: pointer;  
  background-color: #f0f0f0;  
  border-radius: 50%;  
  box-shadow: 0 4px 8px rgba(0,0,0,.25);  
  }  
  .menu_item > a img {  
  border-radius: 50%;  
  width: 40px;  
  height: 40px;  
  }  
  .menu_yellow {  
  background-color: #d4a717;  
  }  
  .menu_green {  
  background-color: green;  
  }  
  .menu_orange {  
  background-color:orange;  
  }  
  .menu_crimson {  
  background-color:crimson;  
  }  
  .menu_blue {  
  background-color: #3c80f6;  
  }  

  .menu_item:hover > .menu_label {  
  opacity: 1;  
  }  
  .menu_btn {  
  position: relative;  
  width: 45px;  
  height: 45px;  
  float: right;  
  cursor: pointer;  
  background-color: #3080e8;  
  border-radius: 50%;  
  box-shadow: 0 4px 8px rgba(0,0,0,.25);  
  }  
  .menu_btn:hover .menu_label {  
  opacity: 1;  
  }  
  .menu_label {  
  position: absolute;  
  top: 14px;  
  right: 115%;  
  padding: 4px 8px;  
  font-size: 14px;  
  color: #fff;  
  background-color:rgba(48, 128, 232, 0.7);  
  border-radius:50px;  
  opacity: 0;  
  pointer-events: none;  
  white-space: nowrap;  
  transition: opacity .2s ease-out;  
  }


Html код вставляете перед тегом :

Код
<div class="menu_br">  
  <div class="menu_drop">  
  <ul class="menu_list">  
  <li class="menu_item">  
  <span class="menu_label">$USERNAME$</span>  
  <a href="/index/8-$USER_ID$"><img src="$USER_AVATAR_URL$" alt="" /></a>  
  </li>  
  <li class="menu_item menu_orange">  
  <span class="menu_label">Пользователи</span>  
  <a href="/index/15"><i class="absolute-center fa fa-user"></i></a>  
  </li>  
  <li class="menu_item menu_green">  
  <span class="menu_label">Сообщения</span>  
  <a href="/index/14"><i class="absolute-center fa fa-paper-plane-o"></i></a>  
  </li>  
  <li class="menu_item menu_crimson">  
  <span class="menu_label">Подписки</span>  
  <a href="load/0-0-0-0-17"><i class="absolute-center fa fa-star-o"></i></a>  
  </li>  
  <li class="menu_item menu_blue">  
  <span class="menu_label">Настройки</span>  
  <a href="/index/11"><i class="absolute-center fa fa-cog"></i></a>  
  </li>  
  <li class="menu_item menu_yellow">  
  <span class="menu_label">Выйти</span>  
  <a href="/index/10"><i class="absolute-center fa fa-sign-out"></i></a>  
  </li>  
  </ul>  
  <div class="menu_btn">  
  <span class="menu_label">  
  Меню  
  </span>  
  <i class="absolute-center fa fa-bars"></i>  
  </div>  
  </div>  
  </div>
Просмотров: 29
Чтобы скачивать файлы зарегистрируйтесь, или войдите под своим логином
Внимание! Материал "Плавающий мини-профиль для uCoz" полностью уникальный. Копирование без указания источника категорически запрещено!
Загрузок: 0 Комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Мини-чат
Все вопросы задаем Админу
здесь и ЛС
Статистика
Онлайн всего: 1
Гостей: 1
Пользователей: 0
Всего: 368 +0 новых
Никого нету
Посетители за сегодня ()