Информация к новости
  • Просмотров: 4129
  • Автор: Алексей
  • Дата: 26-05-2011, 20:42
26-05-2011, 20:42

Делаем всплывающие подсказки в шаблоне

Категория: Уроки Dle


Я давно искал, как бы заменить стандартные (и достаточно невзрачные) хинты на сайте на что-то более заметное и удобное.
И вот, недавно нашел.

Для того, чтобы хинты на сайте отображались сразу по наведению курсора на картинки и ссылки, у которых задан аттрибут "title" и их внешний вид можно было настраивать, вам потребуется:

1) положить в корень сайта файл mw_hint.js
2) в таблице стилей добавить код
.hint {
background-color: #74B2D4;
line-height: 10px;
color: white;
font-family: Verdana;
font-size: 10px;
width: auto;
border-top: 1px solid white;
border-right: 1px solid white;
border-bottom: 1px solid white;
border-left: 1px solid white;
margin: 1px;
padding: 2px;
position: absolute;
visibility: hidden;}


3) в файле шаблона добавить
<script type="text/javascript" src="/mw_hint.js"> </script>


до тега

</head>


После этого, все элементы, имеющие аттрибут "title" будут выглядеть так же, как на этом сайте. Для примера - наведите курсор на текст "Apache's blog" в шапке сайта.


Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
<

Slavchik.ru

7 июня 2011 15:42

Информация к комментарию
  • Группа: Гости
  • ICQ:
  • Регистрация: --
  • Статус:
  • Публикаций: 0
  • Комментариев: 0
Дайте ссылку на файл mw_hint.js am
<

fender

11 июня 2011 11:08

Информация к комментарию
  • Группа: Посетители
  • ICQ:
  • Регистрация: 24.03.2011
  • Статус: Пользователь offline
  • Публикаций: 0
  • Комментариев: 3
^