КАРТЫ
< map name=mymap
> ОПИСАНИЕ ОБЛАСТЕЙ
< /map >
атрибут | СМЫСЛ | значение |
---|
name | уникальное имя карты для организации локальной ссылки
| символьная последовательность, уникальная в пределах
документа |
ОПИСАНИЕ ОБЛАСТИ КАРТЫ
< area >
атрибут | СМЫСЛ | значение |
---|
shape | тип области (прямоугольник, многоугольник
или круг) |
rect poly circle |
coords | координаты вершин или координаты центра и радиус
|
зависит от типа области; для rect это - координаты левой верхней вершины
и правой нижней вершины прямоугольника |
href | адрес файла, который загружается при щелчке
мышкой, курсор которой находится в пределах определяемой области
| URL файла |
target | указывает, что приписанный области файл
будет загружен в новое окно
| _blank |
alt | название файла, который загружается при щелчке
мышкой, курсор которой находится в пределах определяемой области
| произвольный текст |
Для работы с картой используется сначала контейнер
< map name= mymap > ОПИСАНИЕ ОБЛАСТЕЙ < /map >,
а затем тег
< img src=url border=n usemap=#mymap >,
в котором
url
задаёт адрес jpg или gif-файла, содержащего изображение,
которым будет заполнена карта, а
n задаёт размер обрамления карты в
пикселах.
При щелчке мышкой, курсор которой находится в одной из заданных
областей карты, загружается файл, который приписан этой области.
Если мы хотим, чтобы этот файл загружался в новом окне, надо
перед определением карты вставить тег
<base target=_blank >.
Впрочем, параметр
target=_blank можно задавать для отдельной области
в теге
< area >
Приведём пример
<html>
<head>
<title>maps</title>
</head>
<base target=_blank>
<body>
<map name=mymap>
<area shape=rect coords="18,12,266,200" href="tables.html">
<area shape=rect coords="290,12,487,200" href="references.html">
<area shape=rect coords="17,226,111,256" href="pictures.html">
<area shape=rect coords="43,262,111,300" href="examples.htm">
<area shape=rect coords="310,226,496,326" href="colors.htm">
<area shape=rect coords="24,308,212,404" href="maps.htm">
<area shape=rect coords="17,264,38,298" href="pictures.html">
</map>
<img src="ttt1.jpg" border=10 usemap=#mymap>
</body>
</html>