Копируете/размещаете информацию из этой статьи? ПОЖАЛУЙСТА!!! СТАВЬТЕ ССЫЛКУ НА ЭТУ СТРАНИЦУ и указывайте автора!!!
Урок создавался мной. Так что будет всё написано на понятном русском языке(надеюсь вам это пригодится).
Общий тег навигационной карты
<map>
...
</map>
Далее нужно знать, что области выделения бывают трёх видов:
1. Прямоугольник
2. Круг
3. Многоугольник
Рассматривать будем самый простой-это прямоугольник (определение "rect")
Чтобы показать, что мы хотим присвоить ссылку именно прямоугольнику, пишем так
<map>
<area shape="rect">
</map>
Далее нужно присвоить координаты. Смотрим на рисунок:
Что бы узнать координаты загружаем рисунок в Adobe ImageReady
Подвожу мышку к первым координатам x1y2(отмечено красным квадратиком). В правом верхнем углу увидим координаты точки x1y1:
Подвожу ко вторым x2y2. В правом верхнем углу видим координаты точки x2y2:
Запись координат имеет такой вид:
<map>
<area shape="rect" coords="x1,y1,x2,y2">
</map>
Мой прямоугольник имеет такие координаты:
x1=122
y1=109
x2=449
y2=283
Записываю в код:
<map>
<area shape="rect" coords="122,109,449,283">
</map>
Теперь нужно присвоить ссылку этой области, делаем так:
<map>
<area shape="rect" coords="122,109,449,283" href="https://forumd.ru/">
</map>
Почти всё готово, осталось только связать наш код с картой и дать название:
Даём название карте:
<map name="Map">
<area shape="rect" coords="122,109,449,283" href="https://forumd.ru/">
</map>
Что бы связать изображение с картой делаем так:
<img src="https://i.imgur.com/MXj3zH9.jpg" usemap="#Map">
<map name="Map">
<area shape="rect" coords="122,109,449,283" href="https://forumd.ru/">
</map>
Теги: меп-карта,html, урок
Отредактировано Герда (11.11.12 13:04)