Links på forskellige områder af et billede.

- Skrevet af HotBoy77

Hej, her vil jeg vise jer hvordan i putter hyperlinks ind på forskellige områder af et billede:
Her er et eksempel:
Tab.png
Her skal vi have sat links på hver af knapperne.

Vi indlæser billedet sådan her
<img src="http://clan-net.dk/Html/images/Tab.png" alt="" usemap="#imagemap" style="width:781px;height:41px;"> 
  

usemap attributen er der hvor vi indlæser map'en der viser hvor de forskellige hyperlinks er.

Dertil skal vi have defineret en map:

<map name="imagemap"> 
<area shape="rect" coords="213,0,319,25" href="./Home.html" target="" alt=""> 
<area shape="rect" coords="327,0,433,25" href="./About.html" target="" alt=""> 
<area shape="rect" coords="443,0,549,25" href="./Projects.html" target="" alt=""> 
<area shape="rect" coords="559,0,665,26" href="./Products.html" target="" alt=""> 
</map> 

Koordinaterne definere firkantens start og slut.
Andre shapes i kan bruge er:
<area shape="circle">
<area shape="poly">


Prøv koden af!
- Deltag i community projektet hvor vi laver en simpel html template i fællesskab!

Denne artikel er læst 1592 gang(e).
Se flere artikler i kategorien HTML her.

 

Kommentarer til artiklen

Der er ingen kommentare til denne artikel.

 

Skriv en kommentar

Klik for at indsætte: Fed | Kursiv | Link | Billede | Citat | Liste | Kode