9 июня 2011 г.

Всплывающая подсказка


Первый вариант простой,
Так что нервы успокой.

Код второй, конечно, сложно.
Но распутать тоже можно.


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

Вариант  первый.


<span style="cursor: pointer;" title="Ну очень простой!" alt="Ну очень простой!">первый</span>


Можно писать свои статьи как обычно, в текстовом редакторе, а перед публикацией  переходить на вкладку HTML и вносить нужные изменения. В данном случае вставляем вышеприведенную ссылку перед словом первый. Переходим на вкладку Создать и убираем второе слово первый, оно нам больше не нужно. Все.


Вариант второй.


Всплывающая подсказка к изображению, когда  при наведении курсора на картинку всплывает поясняющая надпись  (название, автор и т.д.)

1. Загрузите свою картинку на сайт "Фоторадикал". 


  • Открываем http://www.foto.radikal.ru/
  • Жмем на кнопочку "Обзор", в открывшемся окне ищем подготовленную картинку на вашем ПК, нажимаем "Открыть".
  • Убираем все галочки в Радикале.
  • Нажимаем "Загрузить".
  • В правом столбце с названием "Полноразмерное изображение" из двух вариантов выбираем вариант "не кликабельное".
  • Копируем НТML-код номер 6 ("Картинка в тексте").

2. Вставьте скопированный код в окно добавления записи вашего блога в формате HTML. 
В самом конце кода найдите значки "> (кавычка и угловая скобка). Между кавычкой и угловой скобкой вставьте тег title="ПОДСКАЗКА". Вместо слова ПОДСКАЗКА впечатайте своё  пояснение к картинке.


А теперь наведите курсор на картинку вверху. Как видите, ничего сложного.
Существует множество применений всплывающих подсказок. Это всевозможные поясняющие надписи, расшифровка сокращений, контекстная реклама и многое другое. Но не стоит злоупотреблять ими. Очень часто подсказки перекрывают полезную информацию, а это вызывает раздражение у посетителей.


На написание поста меня вдохновила Алина Беляева . Я только более подробно осветила  эту тему.



Понравилась статья? Поделитесь с друзьями.

3 коммент.:

Рита

Верочка,молодец! Буду пользоваться твоими уроками и зубрить их.

Валентина

Спасибо за подсказку,а то не знала как это сделать.

natasha23

Спасибо, все получилось!!!

Отправить комментарий

Related Posts Plugin for WordPress, Blogger...