< на главную
Установка связи между изображением и навигационной картой (картой активных областей):
<img src="адрес_рисунка" usemap="#имя_карты">
Создание навигационной карты:
<map name="имя_карты">
<area shape="форма" coords="координаты" href="адрес_перехода">
<area shape="форма" coords="координаты" href="адрес_перехода">
. . . . . . . .
</map>
Расшифровка:
img - image - англ. изображение
src - source - англ. источник
map - англ. карта
name - англ. название
area - площадь, пространство, зона
shape - англ. форма
coords - coordinates - англ.координаты
Формы активных областей:
а) shape=rect
Активная область в форме прямоугольника. (rect - rectangle - англ. прямоугольник)
<area shape=rect coords="x1,y1,x2,y2" href="адрес_перехода">
где x1,y1 и x2,y2 - коодинаты противоположных углов прямоугольника
б) shape=circle
Активная область в форме круга. (circle - англ. круг)
<area shape=circle coords="x,y,r" href="адрес_перехода">
где x и y - координаты центра круга, а r - его радиус
в) shape=circle
Активная область в виде многоугольника. (poly - polygon - англ. многоугольник)
<area shape=poly coords="x1,y1,x2,y2,x3,y3,..." href="адрес_перехода">
где x1,y1,x2,y2,x3,y3 и т.д. - координаты углов многоугольника
г) shape=default
В качестве активной области используется вся поверхность карты. Осторожно, эта разновидность не распознаётся IE-ом. (default - англ. значение по умолчанию)
<area shape=default href="адрес_перехода">
Другие атрибуты
alt="текст", title="текст"
Два атрибута, позволяющие вывести текст во всплывающей подсказке. Рекомендую использовать title, поскольку alt применительно к навигационным картам не поддерживается некоторыми браузерами.
Пример
<img src=figure.gif width=500 height=200 usemap=#karta1>
<map name=karta1>
<area shape=rect coords="50,20,150,180" href=main.htm alt="к странице об основных дескрипторах">
<area shape=circle coords="250,100,50" href=text.htm title="к странице о форматировании текста">
<area shape=poly coords="400,30,450,170,300,170" href=table.htm title="к странице об использовании таблиц">
<area shape=default href=empty.htm title="к пустой странице (предупреждала, работает не везде)">
</map>
target