締切済み

Javaの質問です

2014/12/26 04:53

<!DOCTYPE html> <meta charset = utf-8> <title>ゲーム</title>  <style> * {margin:0; padding:0;} html {text-align:center;} canvas{border:1px solid gray;} </style>  <canvas id="canvas" width=320 height=480> HTML5の扱えるブラウザでご覧下さい。 </canvas>  <script> var canvas = document.getElementById("canvas"); var c = canvas.getContext("2d"); //変数の設定と初期化 var frame = 0; //全体のフレーム数のカウント var target = {x:250, y:100, dir:2}; //ターゲット（x位置と移動方向） var target2 = {x:150, y:150, dir:5}; var player = {x:250, y:400}; //プレイヤー（x位置） var ball = {x:-10, y:-10}; //ボール（x位置とy位置） var point = 0; var point2 = 0; var point3 = 0 //得点 var timer = setInterval(anime,50); //anime関数を50ミリ秒毎に起動 //アニメ関数 function anime(){ frame++; //アニメ関数が実行されるたびごとにframeカウントを1上げる //画面をクリア c.clearRect(0,0,320,480);//canvas上の指定された矩形のすべてのピクセルを、透明な黒にクリア //targetを描画 c.fillStyle = "black"; c.fillRect(target.x-25,target.y-5,50,10); c.fillStyle = "black"; c.fillRect(target2.x-25,target2.y-5,50,10); //得点表示 c.fillStyle = "black"; c.font = "20px sans-serif "; c.fillText(point,target.x,target.y-5); //playerを描画 c.fillStyle = "blue"; c.fillRect(player.x-25,player.y-5,50,10); //ballを描画 c.fillStyle = "red"; c.fillRect(ball.x-5,ball.y-5,10,10); //移動計算 target.x += target.dir; //targetのx座標がdir（1）増加 target2.x += target2.dir; ball.y = ball.y - 5; //ballのy座標が5減少 //壁衝突計算 if(target.x < 25 || 295 < target.x)target.dir *= -1; if(target2.x < 25 || 295 < target2.x)target2.dir *= -1; //得点ゲット if ((100 == ball.y) && (Math.abs(target.x - ball.x)<25)){ point2++; } if ((100 == ball.y) && (Math.abs(target2.x - ball.x)<25)){ point3++; } if (point2 > 0 && point3 > 0 ){ point++; } } //シュートする関数 //シュートする関数 canvas.addEventListener("mousedown",function(e){ ball.x = player.x; ball.y = player.y; }); canvas.addEventListener("mousemove",function(e){ var rect = e.target.getBoundingClientRect(); player.x = e.clientX - rect.left; // player.y = e.clientY- rect.top; }); </script> このプログラミングで下段のバーに通って上段のバーに通った時のみにポイントが追加される風にしたいのですがこの状態だと両方通った時にポイント数が上がり続けますどうすればいいでしょうか