Добро пожаловать на форум!
Новые сообщения Участники Правила форума Поиск RSS
Статистика Форума
Последние обновленные темы Самые популярные темы Самые активные пользователи Новые участники
Болт (3758)
XemorDio (2727)
Skyline (2698)
Strelok41 (2177)
SpraVkina [16.11.2017]
Renko9719 [15.11.2017]
dhole [11.11.2017]
Yury21071945 [05.11.2017]
кабестан [04.11.2017]
Страница 1 из 11
Форум » Web-раздел » Скрипты uCoz » Красивый хинт (подсказка)
Красивый хинт (подсказка)
XemorDio Дата: Суббота, 10.09.2016, 17:30 | Сообщение # 1
「 Рипер, техник сайта 」
Группа: Модераторы
Сообщений: 2727
Награды: 13 Репутация: 295
Статус: Offline

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

Перейдём к установке нашей кнопки:

1. Открываем ПУ (Панель управления) -> Дизайн -> Управление Дизайном -> Нижняя часть сайта и вставляем туда следующие скрипты:
Код
<script type="text/javascript" src="http://updatesite.ru/js/jquery.tipsy.js"></script>   
  <script type='text/javascript'>   
    $(function() {    
    $('.north').tipsy({gravity: 'n'});   
    $('.south').tipsy({gravity: 's'});   
    $('.east').tipsy({gravity: 'e'});   
    $('.west').tipsy({gravity: 'w'});    
    });   
  </script>


2. Открываем ПУ (Панель управления) -> Дизайн -> Управление Дизайном -> Таблица стилей CSS и добавляем следующее:
Код
.tipsy {   
    padding: 5px;   
    font-size: 11px;   
    opacity: 0.8;   
    filter: alpha(opacity=80);   
    background-repeat: no-repeat;   
    background-image: url('http://updatesite.ru/tipsy.gif');   
  }   

  .tipsy-inner {   
    padding: 5px 8px 4px 8px;   
    background-color: black;   
    color: white;   
    max-width: 200px;   
    text-align: center;   
  }   
  .tipsy-inner {   
    -moz-border-radius:3px;   
    -webkit-border-radius:3px;   
  }   
  .tipsy-north {   
    background-position: top center;   
  }   
  .tipsy-south {   
    background-position: bottom center;   
  }   
  .tipsy-east {   
    background-position: right center;   
  }   
  .tipsy-west {   
  background-position: left center;   
  }


3. Установка на этом закончена. Теперь просто необходимо добавить к ссылке соответственный класс:
Код
<a class='east' href='http://updatesite.ru' title='Подсказка появляется слева'>Подсказка слева</a>   
  <a class='north' href='http://updatesite.ru' title='Подсказка появляется снизу)'>Подсказка снизу</a>   
  <a class='south' href='http://updatesite.ru' title='Подсказка появляется сверху'>Подсказка сверху</a>    
  <a class='west' href='http://updatesite.ru' title='Подсказка появляется справа'>Подсказка справа</a>
Форум » Web-раздел » Скрипты uCoz » Красивый хинт (подсказка)
Страница 1 из 11
Поиск:
09:23
Обновить

Хостинг от uCoz | Design by XemorDio | MODSTALKER © 2009-2017