[html]mapでイメージマップを定義するサンプル

2021年8月18日

書式
map要素の定義:name="マップの名前"
マップを利用:usemap="#マップの名前"
使用例1

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<map name="regmap">
<area shape="rect" coords="0,20,100,30" href="./reguser.do" target="_top">
</map>
<tr>
<td height="37" width="109">
<img src="img/1002.gif" width="59" height="37" border="0" name="reguser" usemap="#regmap">
</td>
</tr>
<map name="regmap"> <area shape="rect" coords="0,20,100,30" href="./reguser.do" target="_top"> </map> <tr> <td height="37" width="109"> <img src="img/1002.gif" width="59" height="37" border="0" name="reguser" usemap="#regmap"> </td> </tr>
<map name="regmap"> 
  <area shape="rect" coords="0,20,100,30" href="./reguser.do" target="_top">
</map>

<tr>
 <td height="37" width="109">
  <img src="img/1002.gif" width="59" height="37" border="0" name="reguser" usemap="#regmap">
</td>
</tr>

使用例2

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<map name="py">
<area shape="circle" coords="75,75,75" href="left.html">
<area shape="circle" coords="275,75,75" href="right.html">
</map>
<img usemap="#py" src="https://xxx" alt="遷移画面">
<map name="py"> <area shape="circle" coords="75,75,75" href="left.html"> <area shape="circle" coords="275,75,75" href="right.html"> </map> <img usemap="#py" src="https://xxx" alt="遷移画面">
<map name="py">
  <area shape="circle" coords="75,75,75" href="left.html">
  <area shape="circle" coords="275,75,75" href="right.html">
</map>
<img usemap="#py" src="https://xxx" alt="遷移画面">

 

Html

Posted by arkgame