1

画像がランダムに移動し、ユーザーがクリックするとスコアが増加する単純なゲームがあります。

最初の画像はゲーム開始前に表示され、クリックすると JavaScript の play() 関数が呼び出され、その画像が非表示になり、ゲームに使用される画像が表示されます。

それが私のコードが詰まっているところです。それは関数 play() を呼び出しません。私はjavascriptとhtmlが初めてです。どんな助けでも素晴らしいでしょう！

これが私のコードです

<html> 
   <head> 
      <title>Image click Game!</title> 
      <script>
         global var score = 0;
         global var left=400;
         global var top = 100;

         function play() {

            var game = document.getElementById('game');
            var firstDiv = document.getElementById('firstDiv');
            var height = window.innerHeight;
            var width = window.innerWidth;

            firstDiv.style = 'display : none';
            game.style='display : block';

            setInterval("move()", 1000);
        }

        function move() {
           var randomNumberX = Math.floor(Math.random()*11)-5;
           var randomNumberY = Math.floor(Math.random()*11)-5;

           left = left + randomNumberX;
           top = top+randomNumberY;

           var im = document.getElementById('image');
           im.style.left = left;
           im.style.top = top;
       }

       </script> 
    </head> 
 <body> 

    <div id ="firstDiv" style="display : block">
        <img src="pics/playgame.gif" width="108" height="106" onClick = "play()"/></a>
    </div>

        <div id="game" style="display : none">
            <p>"Score: " + score</p>
            <img id="image" src="pics/gameImage.gif"  onClick = "score++" style="position:absolute; left: 400; top: 100;"/></a>
        </div>

  </body> 
</html>
4

2 に答える 2

2

コードにはいくつかの問題があります。

1) あなたの<img>タグは不要なタグで終わってい</a>ます。

2）<img>タグで、に変更する必要がありますonClick = "play();"

global3) javascriptがそのようにキーワードをサポートしているとは思わない。

4) CSS スタイルを変更するには、これを試してください:

firstDiv.style.display = 'none';
game.style.display = 'block';

5) この方法で JavaScript 変数を表示することはできません: <p>"Score: " + score</p>...そもそも宣言された変数「スコア」がないことは言うまでもありません!

それに取り組み続けてください。練習するだけで良くなります。

于 2013-07-01T05:13:47.627 に答える
0

ティールこれ

<script> 

var score = 0;
var left=400;
var top = 100;

function play() {
  var game = document.getElementById('game');
  var firstDiv = document.getElementById('firstDiv');
  var height = window.innerHeight;
  var width = window.innerWidth;
  firstDiv.style.display='none';
  game.style.display='block';
  setInterval("move()", 1000);

}

function move() {
  var randomNumberX=Math.floor(Math.random()*11)-5;
  var randomNumberY=Math.floor(Math.random()*11)-5;
  left= left+randomNumberX;
  top = top+randomNumberY;
  var im= document.getElementById('image');
  im.style.left=left;
  im.style.top=top;

}

于 2013-07-01T04:52:13.060 に答える