Image maps

This is written by me and I hope it is easy to understand

Image maps are the easiest way to break up pictures and to select individual parts from them say i had one picture but wanted to use it to make a link to 2 parts i.e. a picture with people on it, you could make an area on the picture to cover the individual person and so on.

 

Example: If you click on the female's head in the middle and the mans head on left (Herman Meir) it'll take u to the same place but u can set them to different places and add more circles or polygons

click on the bits you want to go to!!!

Code: For the upper example

<MAP NAME="ski">

<AREA SHAPE="circle"

     COORDS="99,52, 29"

     TARGET="imagemap_out"

     HREF="main.htm"

     TITLE="My example of image maps">

<AREA SHAPE="circle"

     COORDS="227, 52, 29"

     TARGET="imagemap_out"

     HREF="main.htm"

     TITLE="My example of image maps, and a little bit more, this is the second one">

<AREA SHAPE="default"

NOHREF>

That part can go anywhere in the <body> section.

Linking the upper code to the picture:

Put this in where you want the picture to go, The USEMAP="#ski" has to be the same as on this link as on the code above, which is written slightly differnt but much the same , map name="ski"

<IMG SRC="AUSTRIANTEAM.jpg" BORDER=0 WIDTH=465 HEIGHT=264 ALT="click on the bits you want to go to!!!" USEMAP="#ski">

and thats all there is to it, just set up more area shape's and links

What the code mean's

AREA SHAPE="circle"     This means-you can make your link to a page a circle, rectangle, or a polygon, the polygone gives you more freedom to make the selection.
COORDS="99,52, 29" The coords means coordinates and the first number which is 99 is along the picture and second number 54 is down the picture, the third number is the size of the circle, i.e. the radius, this would change with the rectangle as 4 points would be needed all you do then is give 4 positions 4 every corner, more on this and the polygone later.
TARGET="imagemap_out"   

All this mean is the target is going out of the picture and to an alternative position.
HREF="main.htm" This is the link that your circle or polygon is going to.
TITLE="My example of image maps"> This just gives a description of when the mouse is over the circle in the picture

 Only adverts below!