<html>
<head>
<meta charset="UTF-8">
<title>アニメの練習</title>
<script src="jquery.min.js"></script>
<script type="text/javascript">
var cW = 600;
var cH = 600;
var mouseX;
var mouseY;
window.onload = function() {
draw();
};
function draw() {
var canvas = document.getElementById('camp');
var ctx = canvas.getContext('2d');
canvas.onmousedown = mouseDownListner;
function mouseDownListner(e) {
adjustXY(e);
ctx.beginPath();
ctx.fillStyle = "#CC0000";
ctx.arc(mouseX, mouseY, 20, 0,3.14, false);
ctx.fill();
}
function adjustXY(e) {
var rect = e.target.getBoundingClientRect();
mouseX = e.clientX - rect.left;
mouseY = e.clientY - rect.top;
}
}
</script>
</head>
<body>
<canvas id="camp" width="600" height="600"></canvas>
</body>
</html>
最終更新：2013年05月20日 11:28
