| 1 |
wakaba |
1.1 |
<!DOCTYPE HTML> |
| 2 |
|
|
<title>Nested <map> elements</title> |
| 3 |
|
|
<!-- Original: From HTML5 spec --> |
| 4 |
|
|
|
| 5 |
|
|
<h1>Shape 1: Only the red box and the green circle should be activatable |
| 6 |
|
|
as hyperlinks</h1> |
| 7 |
|
|
<img src="../../../support/sample-usemap.png" usemap="#shapes1" |
| 8 |
|
|
alt="Four shapes are available: a red hollow box, a green circle, a blue triangle, and a yellow four-pointed star."> |
| 9 |
|
|
|
| 10 |
|
|
<h1>Shape 2: All of the four shapes should be activatable as hyperlinks</h1> |
| 11 |
|
|
<img src="../../../support/sample-usemap.png" usemap="#shapes2" |
| 12 |
|
|
alt="Four shapes are available: a red hollow box, a green circle, a blue triangle, and a yellow four-pointed star."> |
| 13 |
|
|
|
| 14 |
|
|
<map name=shapes2> |
| 15 |
|
|
<map name=shapes1> |
| 16 |
|
|
<area shape=rect coords="50,50,100,100"> <!-- the hole in the red box --> |
| 17 |
|
|
<area shape=rect coords="25,25,125,125" href="red.html" alt="Red box."> |
| 18 |
|
|
<area shape=circle coords="200,75,50" href="green.html" alt="Green circle."> |
| 19 |
|
|
</map> |
| 20 |
|
|
<area shape=poly coords="325,25,262,125,388,125" href="blue.html" alt="Blue triangle."> |
| 21 |
|
|
<area shape=poly coords="450,25,435,60,400,75,435,90,450,125,465,90,500,75,465,60" |
| 22 |
|
|
href="yellow.html" alt="Yellow star."> |
| 23 |
|
|
</map> |