Отправляет email-рассылки с помощью сервиса Sendsay
  Все выпуски  

Веб-разработка? Это просто!


Достаточно часто в процессе веб-разработке дизайнеру приходится сталкиваться с ситуацией, когда необходимо "оживить" ссылку, на которую наводится курсор. Тому, как это сделать без помощи флеша и джава-скриптов посвящен сегодняшний рассказ. Для начала - сслыка на сайты (c-action, Шаг за горизонт), где подобный метод реализован достаточно хорошо. Безо всякого Flash и Java Script мы легко можем сделать интерфейс сайта более динамичным. Суть метода заключается в следующем: мы добавляем в ссылку тег <span></span>, содержащий нужную нам графику. И, до поры, до времен прячем его. А при наведении курсора на ссылку делаем видимым. Абсолютное позиционирование контейнера позволяет нам перемещать графику в любое место пространства. Если проявить фантазию, поле для деятельности – безгранично. Подробный листинг (на примере "Шага за горизонт"):
HTML: &lt;span id="item1">&lt;img src="d1.jpg" alt="" />&lt;/span> CSS: a span { display: none; } a:hover span { display: inline; position: absolute; }
а позиционирование элементов назначается отдельно, по id:
#item1 { left: 495px; top: 100px; }
Все достаточно просто, не правда ли?;-)

В избранное