Home icon Блог о сайтостроительстве » CMS » Dle » Красивый HINT для DLE

Красивый HINT для DLE

22-07-2010, 18:39,   Просмотров: 1284,   Комментариев 0  
HINT - от английского слова подсказка. Если Вы наводите курсор на какой-то объект на сайте, например на картинку, и если у этого объекта прописан тег alt, то всплывет хинт.
Стандартная подсказка при наведении убогая, ее можно и нужно слегка приукрасить.

Впишите это в Вашем шаблоне в main.tpl в разделе head:


<script type="text/javascript" src="{THEME}/css/hint.js"></script>
<link rel="stylesheet" href="{THEME}/css/hint.css" type="text/css" />

Создайте текстовый документ следующего содержания:


.hr_line
{
MARGIN-TOP: 4px;
FONT-SIZE: 3px;
BACKGROUND: url(/templates/nova/images/line.gif);
MARGIN-BOTTOM: 4px;
WIDTH: 100%;
FONT-FAMILY: tahoma;
HEIGHT: 7px
}
#tooltip
{
background: #fff;
border-left: 1px solid #999;
border-right : 1px solid #999;
border-bottom : 1px solid #999;
border-top : 1px solid #999;
font : 11px tahoma;
color : #000;
padding : 8px;
position : absolute;
visibility : hidden;
filter:alpha(opacity=90);
-moz-opacity:0.9;
-khtml-opacity: 0.9;
opacity: 0.9;
}

</style>

Сохраните с его расширением .css и киньте в папку css вашего шаблона.
Скачайте этот hint.zip [1,25 Kb] (cкачиваний: 82) и тоже бросьте в папку css.

Вот и все, хинт установлен. Можете настроить его исходя из своих предпочтений:

background: - Фон
border-left: - Левая сторона
border-right: - Правая сторона
И так далее.

Ключевые слова: HINT, DLE

 (голосов: 2)