Mapujemy obrazek.gif o szerokości i wysokości 200px. Obszar mapowany nazywamy "mapa1":
Kod: Zaznacz cały
<img src="obrazek.gif" width="200" height="200" usemap="#mapa1">
Następnie definiujemy konkretne obszary mapy z przypisanymi odsyłaczami:
Kod: Zaznacz cały
<map name="mapa1">
<area shape=rect coords="1, 1, 100, 200" href="dokument1.html">
<area shape=rect coords="100, 1, 200, 200" href="dokument2.html">
</map>
W efekcie otrzymamy podzielony obrazek.gif na dwa prostokątne obszary.
shape=rect - informuje ze obszarem jest prostokąt
coords="x1, y1, x2, y2" - współrzędne prostokąta
x1, y1 - lewy górny róg
x2, y2 - prawy dolny róg
Definicja dla koła:
Kod: Zaznacz cały
<area shape=circle coords=" x, y, r" href="dokument.html">
shape=circle - informuje że obszarem jest koło
x, y - współrzędne środka koła
r - jak sama zmienna wskazuje promień r koła
Definicja dla obszaru nieregularnego (np. trójkąt, wielokąt... )
Kod: Zaznacz cały
<area shape=polygon coords=" x1, y1, x2, y2, x3, y3" href="dokument.html">
shape=polygon - informuje ze obszarem jest obszar nieregularny
x, y - poszczególne pary wspłrzednych dla każdego punktu tworzącego kształt
Mam nadzieję, że to wystarczy do zrozumiennia sposobu mapowania obrazka.
Ewentualnie zajrzyj tu:
http://www.califweb.republika.pl/mapowanie.html ( Mapowanie w Dreamweaver 4, autor tutorialu: peGaz)
Przy bardziej skomplikowanych kształtach konieczne jest wsparcie się jakimś
programem (Dreamweaver), bardzo ułatwia to prace.
Powodzenia.