usemap属性

このエントリーをはてなブックマークに追加

usemap属性はクリッカブルマップを指定できる属性です。

img要素

img要素はusemap属性を持つ場合はインタラクティブコンテンツとしても扱われ、クリッカブルマップとして利用するmap要素name属性が指定できます。

<img alt="" src="http://www.webcreativepark.net/sample/images/2013-12-05%2013.22.31.jpg" width="500" height="500" usemap="#sample">
<map name="sample">
<area shape="rect" coords="0,0,250,250" href="http://www.webcreativepark.net/sample/" alt="ホーム">
</map>

sample

このサンプルではarea要素で指定した画象の左上の250x250がクリック領域になります。

object要素

object要素はusemap属性でクリッカブルマップとして利用するmap要素のname属性が指定できます。(2014年1月時点で対応ブラウザはFirefoxのみ)

<object data="http://www.webcreativepark.net/sample/images/2013-12-05%2013.22.31.jpg" width="500" height="500" usemap="#sample"></object>
<map name="sample">
<area shape="rect" coords="0,0,250,250" href="http://www.webcreativepark.net/sample/" alt="ホーム">
</map>

sample

登録日 : 2013年12月11日 最終更新日 : 2014年3月6日

同じカテゴリー(属性)のエントリー

検索

スポンサードリンク

バージョン

リファレンス