イメージマップの領域設定

area 空要素

XHTML辞典 >  イメージマップの領域設定 area

スポンサード リンク

クライアントイメージマップのユーザーの操作に反応する領域と、そのリンク先などを設定する要素です。
マップ全体の定義はmap要素で行いますので、area要素はその中で利用されます。
この要素を使用して設定した複数の領域が重なっている場合には、先に指定された領域が優先されます。
なお、この要素と同様の指定はa要素でも行うことができます。

属性

alt="代替テキスト" (必須属性)

イメージマップが表示されない場合に、代わりに利用するためのテキストを指定します。通常は、リンク先などを記述しておけばよいでしょう。

shape="領域の形状"

ユーザーの操作に反応する領域の形状を指定します。

領域の形状

coords="領域の座標"

shape属性で指定した形状の各座標を「,」で区切って指定します。

領域の座標

※ いずれも画像の左上を起点(0,0)とした座標です。
単位は「ピクセル数」または「%」で指定できます。
多角形の座標を指定する場合には、最初と最後の座標が同じになるようにしてください。

href="URI"

領域に対応したリンク先を指定します。

nohref="nohref"

この属性を指定したarea要素の領域には、リンクがないことを示します。
古いブラウザなどでは正しく解釈されない場合があります。

tabindex="Tab移動順"

タブキーを押して項目間を移動させる場合の順序を指定します。
指定できる値は0〜32767の数字で、小さいものから順に移動します。
ただし、値として0が指定されている要素と、特にこの属性が指定されていない要素は、1以上の数値が指定されているものの後に移動します。
複数の要素に同じ値が設定されている場合は、より前にあるものに先に移動します。

accesskey="ショートカットキー"

ショートカットキーを割り当てます。値としては、文字コード中の任意の1文字を指定することができます。

汎用属性

class、id、title、style、lang、dir、xml:lang

Sample

<div>
<img src="area.gif" usemap="#map" width="300" height="25" border="0" alt="メニュー" />
<map id="map" name="map">
<area href="prev.htm" shape="rect" alt="前のページ" coords="0,0,100,25" />
<area href="top.htm" shape="rect" alt="トップぺージ" coords="100,0,200,25" />
<area href="next.htm" shape="rect" alt="次のページ" coords="200,0,300,25" />
</map>
</div>

メニュー 前のページ トップぺージ 次のページ ※リンク先はありません
スポンサード リンク
▲TOP

XHTML辞典