Creating a client-side image map

This is how you set up a client-side image map.

StepsTo create a client-side image map:

  1. In Page view or Source view of the HTML editor, select Insert>Image to insert the image in your document.

  2. On the Image tab of the Image Properties dialog box, type a pound sign (#) followed by the name of a MAP element (which you will create next) in the Corresponding <MAP> Object For A Client-Side Image Map text box.

    Click OK.

    In the Source view for the current HTML document, the IMG element includes the USEMAP attribute that is assigned to the map name you entered:

    <IMG SRC="image-url" USEMAP="#mymap">
    
  3. In Source view, insert a MAP element in the document and assign it a NAME attribute that matches the name you typed for the USEMAP attribute:

    <MAP NAME="mymap"></MAP>
    

    You can add this to the document source before or after the IMG element, or in the Head section.

  4. Inside the MAP element, add the AREA elements required to identify different regions of the image. A basic syntax is shown here:

    <AREA SHAPE="shape" COORDS="x1,y1,x2,y2..." HREF="url">