Area shape Property - Javascript DOM HTML Element

Javascript examples for DOM HTML Element:Area

  1. HOME
  2. Javascript
  3. DOM HTML Element
  4. Area

Description

The shape property sets or gets the value of the shape attribute of an area.

Set the shape property with the following Values

Value Description
default Sets the entire region
rectDefines a rectangular region
circle Defines a circular region
polyDefines a polygonal region

Return Value

A String, representing the shape type of the area

The following code shows how to Change the shape for a specific area in an image-map:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<body>

<img src="http://java2s.com/resources/a.png" width="145" height="126" usemap="#myMap">

<map name="myMap">
  <area id="myId" shape="circle" coords="125,60,10" alt="Venus" href="venus.htm">
</map>//from  www  . java  2s.c  o m

<button onclick="myFunction()">change the shape</button>

<p id="demo"></p>

<script>
function myFunction() {
    document.getElementById("myId").shape = "default";
    document.getElementById("demo").innerHTML = "The shape was changed from 'circle' to 'default'.";
}
</script>

</body>
</html>

Related Tutorials