----------------------------------- nate Wed May 28, 2003 9:18 pm [Tutorial] Image Maps ----------------------------------- Image Maps An image map is a single image that can be linked to multiple web pages. For example, you could have a single image of a map of Canada. When you click on different areas of the map, you will bring up different web pages. Step 1 - Find a suitable image First you have to find an image that you want to use. You will want to click on different parts of the image to bring up different web pages. Step 2 - Give your image a name Second, you have to define the name of your image map in your HTML code. In this example, the name of the map is menu : Step 3 - Define clickable areas Next you have to define the clickable parts of your image. In the following example, the shape of the clickable image is a rectangle (shape="rect") the top left co-ordinate (15,10) and the bottom right corner co-ordinate (170,25) are listed. The place where you link to is also defined (href="cs.html") To find the coordinates of where you want to click, open your image up in a graphics software package like Photo Editor move the cursor over the areas you want to be clicked. the coordinates will appear in the status bar at the bottom of the screen. The 2 remaining clickable areas are also defined: Then you end the MAP tag that you started in step 2 Step 4 - Insert image file Finally, the actual image you found in step one is inserted in the HTML document with the name of the defined image map. Note that you must include the usemap= "#menu" attribute to tell the Browser that the image is an image map Hope this is useful ----------------------------------- void Thu May 29, 2003 3:05 pm ----------------------------------- no offence...but tedious things like this are much more easily done in FP or Dream Weaver...and then after your finished, cut and paste the code and remove the meta header that states that it used FP...coz sometimes that screws up navigator pages.... ----------------------------------- JSBN Thu May 29, 2003 3:51 pm ----------------------------------- very nice + 10 bits