HTML: Популярный самоучитель | страница 35
Изображения-карты
Рассмотрим еще один интересный способ использования изображений для навигации – создание изображений‑карт. Карта – это заданный набор областей различной формы. Заданные области карты считаются активными, и браузер работает с ними практически аналогично тому, как он работает с изображениями‑гиперссылками. Так вот, изображение‑карта – это обычное изображение с наложенной на него картой активных областей. Карту можно использовать не только с изображениями, но здесь будет рассмотрено использование карт именно с ними – так нагляднее.
Карта, используемая для изображения, может быть создана в любом документе, URI которого известен. Для создания карты используется элемент MAP (задается парными тегами ). Обычно для элемента MAP задается значение атрибута name – имя, которое используется для ссылок на созданную карту.
Внутри элемента MAP при помощи одиночных тегов (HTML‑элемент AREA) задаются активные области карты. Для каждого элемента AREA могут задаваться следующие атрибуты:
• coords – координаты активной области (количество и значение зависят от типа области, заданного атрибутом shape);
• href – URI, на который указывает гиперссылка, ассоциированная с областью;
• nohref – булев атрибут, создает неактивную область (с областью ассоциируется пустая гиперссылка);
• shape – задает тип области, может принимать значения: rect (прямоугольник), circle (круглая область), poly (многоугольник) и default (по умолчанию используется вся область карты);
• alt – альтернативный текст;
• title – текст подсказки (отображается в виде всплывающей подсказки при наведении указателя мыши на область);
• tabindex – позиция элемента карты в порядке табуляции в HTML‑документе (целое число от 0 до 32 767).
Задание набора значений атрибуту coords существенно отличается для областей различных видов. Значения задавать не нужно, если используется значение атрибута shape по умолчанию. Иначе при задании значений атрибуту coords нужно следовать следующим правилам.
• Если для атрибута shape установлено значение rect, то атрибуту coords задаются координаты верхнего левого и нижнего правого углов прямоугольника (например, coords="10,10,34,45").
• Если для атрибута shape установлено значение poly, то атрибуту coords задаются координаты всех вершин многоугольника. При этом лучше координаты первой вершины указать и в конце, а то вдруг разработчики браузера забыли создать автоматическое закрытие многоугольника (например, coords="10,10,34,45,50,20,10,10" – задание треугольной области).