Карты-изображения

    Ссылки являются одной из основных частей всемирной сети и позволяют объединять различные

    Карты-изображения позволяют привязывать ссылки к разным областям одного изображения. Реализуется в двух различных вариантах - серверном и клиентском. В случае применения серверного варианта браузер посылает запрос на сервер для получения адреса выбранной ссылки и ждет ответа с требуемой информацией. Такой подход требует дополнительного времения на ожидание результата и отдельные файлы для каждой карты-изображения.

    В клиентском варианте карта располагается в том же HTML-документе, что и ссылка на изображение.

    Клиентский вариант карты-изображения

    Для указания того, что изображение является картой, используется параметр usemap тега IMG. В качестве значения используется ссылка на описание конфигурации карты.

    Рис. 1. Закладки являются ссылками, созданными с помощью карты

    Чтобы сделать ссылки на закладки, показанных на рис. 1, следует использовать следующий код.

    Пример. Использование карты-изображения:

<img src="map.gif" width=411 height=46 border=0 usemap="#map"> <map name="map"> <area shape="poly" alt="Закладка 2" coords="210,27, 203,9, 202,6, 197,2, 192,1, 120,1, 115,2, 110,6, 112,9, 119,27, 119,32, 211,32, 210,27" href="2.html"> <area shape="poly" alt="Закладка 3" coords="302,27, 295,9, 293,6, 289,2, 283,1, 212,1, 206,2, 202,6, 203,9, 210,27, 211,32, 284,32, 303,32, 302,27" href="3.html"> <area shape="poly" alt="Закладка 4" coords="302,27, 303,32, 394,32, 393,27, 386,9, 382,3, 375,1, 303,1, 298,2, 293,6, 295,9, 302,27" href="4.html"> </map>

    Для указания браузеру, что изображение является картой, используется параметр usemap. Он является ссылкой на описание конфигурации карты, которая задается тегом MAP. Значение параметра name данного тега должно соответствовать имени в usemap. Для задания активой области, являющейся ссылкой на HTML-документ, используется тег AREA.

---

    Параметры тега AREA

    SHAPE

    Определяет форму активной области. Форма может быть в виде окружности (circle), прямоугольника (rect), полигона (poly).

    ALT

    Добавляет альтернативный текст для каждой области. Служит лишь комментарием для ссылки, поскольку на экран никогда не выводится.

    COORDS

    Задает координаты активной области. Координаты отсчитываются в пикселах от левого верхнего угла изображения, которому соответствует значение 0,0. Первое число является координатой по горизонтали, второе - по вертикали. Список координат зависит от формы области.

    Для окружности задаются три числа - координаты центра круга и радиус.

<area shape=circle coords="230,340, 100" href=circle.html>

    Для прямоугольника - координаты левого верхнего и правого нижнего угла.

<area shape=rect coords="24,18, 210,56" href=rect.html>

    Для полигона задаются координаты его вершин (рис. 2).

    Рис. 2. Координатные точки для полигона

    HREF
    Определяет адрес ссылки для области. Правила записи такие же, как и для тега А.