画像の上だけで移動する

任意の画像の上でクリックした時だけ画像を配置したいのですが、どうすれば良いでしょうか？
いろいろ試したのですが、うまく作動しないです。
お願いします。
下にプログラムを載せておきます。

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>castom</title> <script type="text/javascript"></script> </head> <body style="background-image : url(/ゲーム2/bg.jpg);"> <img id="aaa" src="/ゲーム2/map.jpg" height="500"> <img src="/ゲーム2/markar.jpg" name="myIMG" style="position:absolute;" > </body> <script language="JavaScript"> function moveImg() { myIMG.style.left = event.x; myIMG.style.top = event.y; } window.document.onclick = moveImg; </script> </html> <script type="text/javascript"> (function (){ var element = document.getElementById("aaa");

function MouseDownFunc(e){
	console.log("マウスのボタンが押された");
	console.log(x=event.x,y=event.y);
}
// イベントリスナーに対応している
if(document.addEventListener){
	document.addEventListener("mousedown" , MouseDownFunc);// マウスのボタンを押すと実行されるイベント
// アタッチイベントに対応している
}else if(document.attachEvent){
	document.attachEvent("onmousedown" , MouseDownFunc);// マウスのボタンを押すと実行されるイベント
}})();

</script> </script>

行動規範の内容に同意します

回答1件

ベストアンサー

がんばってください。

HTML
1<html>
2<head>
3<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
4<title>castom</title>
5<script type="text/javascript"></script>
6</head>
7<body style="background-image : url(/ゲーム2/bg.jpg);">
8<img  id="aaa" src="/ゲーム2/map.jpg" height="500">
9<img src="/ゲーム2/markar.jpg" name="myIMG" style="position:absolute;" >
10</body>
11
12<script language="JavaScript">
13function moveImg(event)
14{
15    myIMG.style.left = event.pageX;
16    myIMG.style.top  = event.pageY;
17}
18document.getElementById('aaa').onclick = moveImg;
19</script>
20
21</html>