Тултип, движущийся вместе с курсором
Тултип создается очень несложно, код сосотоит из
- небольшого JavaScript файла,
- маленького файлика таблицы стилей
- и изображения в формате GIF.
Функционирование скрипта осуществляется следующей последовательностью действий:
- Проверяем, что браузер поддерживает DOM (объектную модель документа);
- Если поддерживает, сохраняем в переменных адрес ссылки HREF и значение атрибута TITLE и генерируем с их помощью текст для будущего тултипа;
- Когда мышь оказывается над ссылкой, появляется соответствующий, оформленный с помощью CSS, тултип.
В раздел <head> сайта добавляем следующие несколько строк кода:
где "identificator" - ID того блока контента, в ссылках внутри которого должны показываться тултипы. Если тултипы должны отображаться на всём сайте, внутри скобок ничего не должно быть - ().
Если в ссылке не используется атрибут TITLE, в тултипе его значение заменяется словом: "link:"
Все три файла размещаются в корне сайта. При желании разместить их в других местах, надо изменить ссылки на bt.css в BubbleTooltips.js и, соответственно, на bt.gif в bt.css.
Особо следует заметить, что файл bt.css подключается динамически через JavaScript и его не надо прописывать в
html - файла.