私がしたいのは、さまざまな州のある国の地図を用意し、ユーザーがその州をクリックしたときに別のページにその州を説明することだけです。状態の異なる画像マップをエリアとして作成しましたが、クリックした状態の実際の座標を入れることができませんでした。
これが私のコードです:
<script language="JavaScript">
function point_it(event,id){
pos_x = event.offsetX?(event.offsetX):event.pageX-document.getElementById("pointer_div").offsetLeft;
pos_y = event.offsetY?(event.offsetY):event.pageY-document.getElementById("pointer_div").offsetTop;
k=pos_x;
document.getElementById(id).coords.value=k;
}
</script>
</head>
<body>
<br><br>
<h1>Country Locations</h1>
<div id="pointer_div">
<img alt="country map " src="images/country.jpg"
onclick="point_it(event,'state')" width="500" height="300" usemap="#map" />
</div>
<map name="map">
<area id="State" alt="IT" shape="default" coords=" " href="#bang" />
</map>
<div id="bang"><h3>State</h3></div>
<p>Located at Country</p>