Хаки и Скрипты Next Generation CMS

Красивые всплывающие подсказки через easyTooltip

irbees2008 irbees2008 Опубликовано - 9 - сентября Tooltips
1602 - 0
  • Адаптировал: irbees2008
  • Уровень сложности исполнения: нужны навыки css html

Всем привет , и вот новый скриптик ,может и не новый только у меня он хранится уже почти год )). Просто может кому и пригодится. Скрипт простенький, доплнительной разметки и тегов не нужно, просто наличие тега title там где он нужен. Подобных скриптов много в сети, уже был подобный, но здесь еще tooltip используется как информационный блок.
Ну вот пример ссылки

Код:
<a href="Здесь ссылка" title="<b>Ну здесь сам title</b><br/><br/>Ну а здесь выводим небольшой текст"/>Здесь текст кнопки</a>

И так приступим
1. Скачиваем архив Вы не можете скачивать файлы с нашего сайта ,рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем. , рапоковываем и заливаем файл tooltip.js в ваш шаблон в папку js
2. В main.tpl между добавить следующий код:
Код:
<script type="text/javascript" src="{{ tpl_url }}/js/tooltip.js"></script>
<script>$(document).ready(function() {$("a").easyTooltip()}); $(document).ready(function(){$("img").easyTooltip()}); </script>

3. Ну и в файл стилей добавить стилей:
Код:
/*Tooltip - всплывающие подсказки*/
#easyTooltip{
max-width: 300px;
padding:10px;
border:1px solid #000;
background:#000;
color: #ccc;
border-radius: 6px;
opacity: 0.8;
font-size: 15px ;
z-index: 9999;
box-shadow: 0px 0px 15px #000;
}

Можешь почитать и вот эту статейку "Тег input"

Опрос

Ваше мнение

На каком движке ваш сайт?
Результаты

Последние комментарии

Теги

Anything in here will be replaced on browsers that support the canvas element

Статистика

  • Caйту: 3319 дней
  • Новостей: 542
  • Комменты: 254
  • Зарегистрированно : 570
  • Онлайн всего: [8]
  • Гости: [8]
  • Были сегодня : [4] Яндекс, Google, irbees2008, Яндекс
  • SQL запросов: 32
  • Генерация страницы: 0.588сек
  • Потребление памяти: 4.936 Mb 
  •   яндекс.ћетрика