HTML Image Map
With HTML image maps, you can create clickable areas on an image.
<map> tag defines an image map. An image map is an image with
The areas are defined with one or more
Try to click on the hot air balloon in the image below: (this is only optimized for desktop users)
<map> element is used to create an image map, and is linked to the image
by using the required name attribute:
You must define the shape of the clickable area, and you can choose one of these values:
rect- defines a rectangular region
circle- defines a circular region
poly- defines a polygonal region
default- defines the entire region
The coordinates for shape="rect" come in pairs, one for the x-axis and one for the y-axis.
To add a circle area, first locate the coordinates of the center of the circle & Then specify the radius of the circle.
The shape="poly" contains several coordinate points, which creates a shape formed with straight lines (a polygon).