YouTip\n
\n\nHTML DOM Area coords Property
\n\n\n\n
\n\n\n
\n\n\n
\n\n
HTML DOM Area coords Property
\n\nDefinition and Usage
\nThe coords property sets or returns the value of the coords attribute of an area.
\nThe coords attribute specifies the coordinates of an area in an image map.
\nNote: The coords attribute is used together with the shape attribute to specify the size, shape, and placement of an area.
\n\nBrowser Support
\n| Property | Google Chrome | Internet Explorer | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| coords | Yes | Yes | Yes | Yes | Yes |
Syntax
\nReturn the coords property:
\nareaObject.coords\n
Set the coords property:
\nareaObject.coords = value\n\n
Property Values
\n| Value | Description |
|---|---|
| x1,y1,x2,y2 | Specifies the coordinates of the top-left and bottom-right corner of the rectangle (for shape="rect") |
| x,y,radius | Specifies the coordinates of the circle center and the radius (for shape="circle") |
| x1,y1,x2,y2,..,xn,yn | Specifies the coordinates of the edges of the polygon. If the first and last coordinate pairs are not the same, the browser must add the last coordinate pair to close the polygon (for shape="poly") |
Technical Details
\n| Return Value: | A String, representing a comma-separated list of coordinates |
|---|---|
| DOM Version | Core Level 2 |
More Examples
\nExample
\nChange the coordinates of a circular area to (90,58,3):
\n<img src="planets.gif" width="145" height="126" usemap="#planetmap">\n<map name="planetmap">\n <area id="venus" shape="circle" coords="90,58,3" alt="Venus" href="venus.htm">\n</map>\n\n<script>\ndocument.getElementById("venus").coords = "90,58,3";\n</script>\n\nTry it Yourself »
\n\nExample
\nReturn the coordinates of a circular area:
\nvar x = document.getElementById("venus").coords;\nThe result of x will be: 90,58,3
\n\nTry it Yourself »
\n\nRelated Pages
\nHTML reference: HTML <area> coords attribute
\n\n