Képtérképek (image map) beillesztése HTML dokumentumba
Név | Angol eredete | Hatás | Jellemzők |
---|---|---|---|
<map> | Map | Képtérkép definíció. Páros címke. | Általános ; Események |
<area> | Area | Terület meghatározása és a adott területhez hivatkozás hozzárendelése. Páratlan címke. | Általános ; Események |
A következő böngészők támogatják: |
---|
A <map> címke használata esetén kötelező a name jellemző megadása. Ennek segítségével kapcsolhatjuk a képtérképet egy állóképhez.
Az <area> címke shape jellemzője megadja a terület alakját. Az alak lehet "rect" (téglalap), "circle" (kör) vagy "poly" (általános sokszög)
Az <area> címke coords jellemzője megadja a geometriai alakzat koordinátáit:
- rect: balfelsősarok-x, balfelsősarok-y, jobbalsósarok-x, jobbalsósarok-y
- circle: középont-x, középpont-y, sugár
- poly: x1,y1, x2,y2, ... xn,yn
Példa:
Forráskód
<h2>Kattintson a kiválasztott alkatrészre:</h2>
<img src="alaplap.jpg" … usemap="#map_name">
<map name=" map_name">
<area shape="rect" coords="0,0,82,126" alt="Processzor" href="processzor.htm">
<area shape="rect" coords="55,65,282,326" alt="Memória" href="memoria.htm">
….
<area shape="circle" coords="124,58,8" alt="Akkumulátor" href="akku.htm">
</map>
Eredmény*
* Az eredmény megjelenítése az Ön által használt böngészőtől függ.
A példakód külön ablakban is megtekinthető: html5_imagemap_1.html