HTML подсказка при наведении указателя мыши

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

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

1. Скачайте этот архив. И разархивируйте в корневую папку сайта.

2. Добавьте на страницу этот скрипт перед закрывающим тегом HEAD

<script type="text/javascript" src="/podskazka.js" charset="UTF-8"></script>

3. Добавьте в файл стилей с расширением .css такую строку:

div#qTip {padding: 3px; border: 1px solid #666; display: none; background: #e6fff5; color: #000; font-size: 14px; text-align: left; position: absolute; z-index: 1000; opacity: 0.9; filter: alpha(opacity=90); -moz-opacity: 0.9;}

Вот и все.

Изменить параметры подсказки

1. Изменение отступов в самом верху файла podskazka.js строки:

var qTipTag = "a,input,span";
var qTipX = 10;
var qTipY = 25;

2. Изменение стилей:

border: 1px solid #666; - задание толщины рамки и её цвета,
background: #e6fff5; - задание фона рамки,
font-size: 14px; - размер шрифта,
color: #000; - цвет шрифта.
Этот материал впервые был опубликован 27 января 2017 года. Актуальность информации подтверждена 10 марта 2024 году.