LINK_MAP

Map Links

This is a 300 by 200 gif but could just as easily be jpg or any size. The origin 0,0 is in the top left hand corner and the first co-ord is distance for the left and the second is the distance down. Start with the map name and then the co-ords of the rectangle of the area you wish to use as the link coords="0,0,10,10" and the place you want to link to href=TOP-LEFT and finally any pop-up alt="Top Left 0,0"

<MAP name="tester">
<AREA type=rect coords="0,0,10,10" href=TOP-LEFT alt="Top Left 0,0">
<AREA type=rect coords="50,50,100,100" href=50,50-100,100 alt="50,50-100,100">
<AREA type=rect coords="200,50,250,100" href=blah blah alt="200,50-250,100">
<AREA type=rect coords="290,190,300,200" href=bottom-right alt="Bottom Right 300,200">
</MAP>

 Then when you call in the image you just add usemap="#tester"

<IMG SRC="images/picagif.gif" BORDER=2 usemap="#tester" HEIGHT=200 WIDTH=300>

Source Code <HTML>
<HEAD>
 <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
 <META NAME="Author" CONTENT="nik">
 <META NAME="GENERATOR" CONTENT="Mozilla/4.05 [en] (Win16; I) [Netscape]">
 <TITLE>LINK_MAP</TITLE>
</HEAD>
<BODY TEXT="#000000" BGCOLOR="#FFFFCC" LINK="#0000EE" VLINK="#551A8B" ALINK="#FF0000">

<CENTER><MAP name="tester"><AREA type=rect coords="0,0,10,10" href=TOP-LEFT alt="Top Left 0,0"><AREA type=rect coords="50,50,100,100" href=50,50-100,100 alt="50,50-100,100"><AREA type=rect coords="200,50,250,100" href=blah blah alt="200,50-250,100"><AREA type=rect coords="290,190,300,200" href=bottom-right alt="Bottom Right 300,200"></MAP>Map
Links</CENTER>

<BLOCKQUOTE>    This is a 300 by 200 gif but
could just as easily be jpg or any size. The origin 0,0 is in the top left
hand corner and the first co-ord is distance for the left and the second
is the distance down. Start with the map name and then the co-ords of the
rectangle of the area you wish to use as the link coords="0,0,10,10"
and the place you want to link to href=TOP-LEFT and
finally any pop-up alt="Top Left 0,0"
  
 <MAP name="tester">
 <AREA type=rect coords="0,0,10,10"    href=TOP-LEFT       
alt="Top Left 0,0">
 <AREA type=rect coords="50,50,100,100" href=50,50-100,100  
alt="50,50-100,100">
 <AREA type=rect coords="200,50,250,100" href=blah blah      
alt="200,50-250,100">
 <AREA type=rect coords="290,190,300,200" href=bottom-right   
alt="Bottom Right 300,200">
 </MAP>
  
     Then when you call in the image you
just add usemap="#tester"
  
 <IMG SRC="images/picagif.gif" BORDER=2 usemap="#tester" HEIGHT=200
WIDTH=300></BLOCKQUOTE>

<CENTER>Source Code</CENTER>