map 要素

4.7.11 map 要素

カテゴリー:
フロー・コンテント
フレージング・コンテント
パルパブル・コンテント
この要素を使うことができるコンテキスト:
フレージング・コンテントが期待される場所
コンテントモデル:
トランスペアレント
コンテント属性:
グローバル属性
name - usemap 属性から参照するイメージマップの名前
text/html におけるタグの省略:
どちらのタグも省略できません。
指定可能な ARIA role 属性 の値:
なし
指定可能な ARIA ステートとプロパティ属性:
グローバル aria-* 属性
DOM インタフェース:
interface HTMLMapElement : HTMLElement {
           attribute DOMString name;
  readonly attribute HTMLCollection areas;
  readonly attribute HTMLCollection images;
};

map 要素は、img 要素と area 要素の子孫と組み合わせてイメージマップを定義します。この要素は、その子を表します。

name 属性はマップに名前を与え、それを参照できるようにします。この属性は必須で、スペース文字を含まない空でない値でなければいけません。name 属性の値は、同じドキュメントにある別の map 要素の name 属性の値に一致してはいけません。大文字と小文字は区別されませんid 属性も指定されたら、この両方の属性は同じ値を持たなければいけません。

map . areas

map 要素の中にある area 要素の HTMLCollection を返します。

map . images

map 要素を使う img 要素と object 要素の HTMLCollection を返します。

areas 属性は、map 要素をルートとした HTMLCollection を返さなければいけません。そのフィルタは area 要素だけに一致します。

images 属性は、Document ノードをルートとした HTMLCollection を返さなければいけません。そのフィルタは、イメージマップ処理モデルによってこの map 要素と結びづけられる img 要素と object 要素だけに一致します。

IDL 属性 name は、同じ名前のコンテント属性を反映しなければいけません。

イメージマップは、保守性を容易にするために、ページの他のコンテンツと組み合わせて定義することができます。この例では、ページの最初にイメージマップがあり、最後には、それに対応するテキストリンクがあります。

<!DOCTYPE HTML>
<TITLE>Babies™: Toys</TITLE>
<HEADER>
 <H1>Toys</H1>
 <IMG SRC="/images/menu.gif"
      ALT="Babies™ navigation menu. Select a department to go to its page."
      USEMAP="#NAV">
</HEADER>
 ...
<FOOTER>
 <MAP NAME="NAV">
  <P>
   <A HREF="/clothes/">Clothes</A>
   <AREA ALT="Clothes" COORDS="0,0,100,50" HREF="/clothes/"> |
   <A HREF="/toys/">Toys</A>
   <AREA ALT="Toys" COORDS="0,0,100,50" HREF="/toys/"> |
   <A HREF="/food/">Food</A>
   <AREA ALT="Food" COORDS="0,0,100,50" HREF="/food/"> |
   <A HREF="/books/">Books</A>
   <AREA ALT="Books" COORDS="0,0,100,50" HREF="/books/">
 </MAP>
</FOOTER>

※ 原文:http://www.w3.org/TR/2014/REC-html5-20141028/embedded-content-0.html#the-map-element