Klikací mapa je velice zajímavá a hravá funkce, která se tak často nevidí.
Abysme dokázali vytvořit klikací mapu, potřebujeme prvně vědět dvě nové značky a několik jejich atributů:
<map>
<area>
Vysvětlovat toto všechno slovně by mohlo zabrat pár řádků, proto zde toto téma budu vysvětlovat výhradně pomocí obrázků, pokud však obrázky vám budou málo, můžete přejít na podrobné vysvětlení klikacích map, stačí kliknout zde.
Začneme tedy vložením obrázku, nyní ale musíme přidat ještě jméno obrázku.
Jméno je volitelné, pro pozdější orientaci v kódu je však lepší si ji pojmenovat nějak tématicky
Nyní přijde ta složitější část:
Zprvu použijeme párovou značku <map>,
kde budeme následně psát všechny oblasti odkazů.
Aby prohlížeč pochopil, k jakému obrázku má danou mapu přiřadit,
zapíšeme do otevírací značky jméno zvoleného obrázku:
Nyní můžeme psát jednotlivé oblasti různých odkazů
K zapsaní takové oblasti použijeme značku <area>, ve které budeme potřebovat několik atributů pro její správný chod:
Atribut "shape(tvar)" určuje, jaký tvar bude mít oblast tvar,
atribut "coords(souřadnice)" nám říká,
kde na obrázku se bude odkaz nacházet,
další atribut již známe a ten nám samozřejmě určuje kam nás odkaz pošle.
Poslední atribut je volitelný,"alt(alternativa)" již také známe,
v případně chyby nám napíše co měl odkaz/obrázek obsahovat
Kód:
Výsledek:
Pro více informací, ku příkladu jak získat souřadnice a jak se píší za sebou, klikněte zde.
V dalším díle si ukážeme interní odkazy