Оригинальные подсказки для:title (на jQuery)

+6
1.15K
ИллюстрацияИллюстрация

1 действие

Подключим скачанные скрипты, прописав их между тегами <head>
  1.  
  2. <script type="text/javascript" src="/templates/!!! НАЗВАНИЕ ШАБЛОНА/js/qtip.js"></script>
Не забываем закинуть файлы: jQuery.js и qtip.js

2 действие

Перед закрывающимся тегом </body> вставим следующий скрипт:
  1. <script type="text/javascript">
  2.  
  3. $(document).ready(function()
  4.  
  5. {
  6.  
  7. $('a[title]').qtip({
  8.  
  9. position: {
  10.  
  11. corner: {
  12.  
  13. target: 'bottomRight',
  14.  
  15. tooltip: 'topLeft'
  16.  
  17. }
  18.  
  19. },
  20.  
  21. style: {
  22.  
  23. name: 'blue',
  24.  
  25. padding: '7px 13px',
  26.  
  27. width: {
  28.  
  29. max: 200,
  30.  
  31. min: 0
  32.  
  33. },
  34.  
  35. tip: true
  36.  
  37. }
  38.  
  39. });
  40.  
  41. });
  42.  
  43. </script>
Вот и всё.

*******************************************************
Если вам не подходит цвет, его можно поменять, найдя соответствующий стиль в файле скрипта qtip.js и исправив цвета на свои.
Чтобы поменять положение уголка подсказки, нужно исправить параметр tooltip. Он может принимать следующие значения: Иллюстрация
Чтобы обозначить место появления подсказки относительно объекта, поменяем значение target. Оно может принимать те же значения, что и уголок.
В том месте, где мы хотим видеть подсказку, добавим ссылке элемент title.
+1
Telema93 Telema93 13 лет назад #
афтар! сократи под кат статью, плиз...
+2
Telema93 Telema93 13 лет назад #
Единственная проблема это конфликт с вкладками в профиле
<script type="text/javascript" src="/templates/!!! НАЗВАНИЕ ШАБЛОНА/js/jQuery.js"></script> - вы подключаете библиотеку jQuery второй раз, а она уже подключена в двиге. Если убрать - по идее или заработает, или нужно решать что-то с самой библиотекой
+2
alegcool alegcool 13 лет назад #
catsite:
афтар! сократи под кат статью, плиз..
Сократил.
+1
alegcool alegcool 13 лет назад #
catsite:
Если убрать - по идее или заработает, или нужно решать
Убрал, помогло. Спасибо.

Еще от автора

Страница когда выключен сайт
В принципе объяснять тут не чего, это страница о том что работа сайта приостановлена.
В фото галереи  название не над изображениями, а на изображениях
ВНИМАНИЕ!!! Перед тем ка приступить зе забываем сделать копии файлов:styles.css, com_photos_view_photo.
Подсказки про ссылки на файлы (на CSS)
Если на сайте есть ссылки ссылающиеся на вордовские, PDF файлы, то будет отображаться иконка.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.