1

私の HTML には、ゲームを実行するイベント リスナーを追加する JavaScript を含むセクションがあります。

<div class="content">
<script>
        window.addEventListener('load', Game.start);
</script>
</div>

JavaScript がその上の div 内に含まれるようにするにはどうすればよいですか? それが表示されるとき、ゲームは完全にその外にあります。

私はcrafty.jsフレームワークを使用しています。ドキュメントはこちら: http://craftyjs.com/api/

4

3 に答える 3

2

何をするかわからGame.startない。ただし、スクリプトはコンテナー要素にある必要はありません。あなたは単にそのようなものを持つことができます:

<html>
  <head>
    <script>
      // here some library that defines `Game.start`
      window.addEventListener('load', Game.start);
    </script>
  </head>
  <body>
    <div class="content" id="game-container"></div>
  </body>
</html>

内部Game.startでは、必要な要素への参照を取得するために使用document.getElementById("game-container")する必要があり、それを使用して必要なノードを追加します。

于 2013-04-06T01:42:02.740 に答える
1

その Div に ID を与えてから、javascript を変更して div の ID にオブジェクトをロードする必要があります。

于 2013-04-06T01:42:32.383 に答える
1

コメントの 1 つに記載されているように、「cr-stage」という ID を持つ div は、crafty.js にとって重要です。ただし、実際に含める必要はありません。省略すると、自動的に作成されます。

<html>
  <head>
    <!-- this is the crafty.js library, which you could load from another server -->
    <script src="crafty.js"></script>

    <!-- this is the script where all your game's JS goes -->
    <script src="mygame.js"></script>

    <script>
      window.addEventListener('load', Game.start);
    </script>
  </head>
  <body>
  </body>
</html>

上記を使用すると、cr-stage ID が作成されます。

あなたの質問に関連する可能性のあるもう1つのことは、crステージを中央に配置し、その上に自動的に表示される小さなギャップを削除する場合です. これを行うには、次のコードを使用します。

<html>
  <head>
    <!-- this is the crafty.js library, which you could load from another server -->
    <script src="crafty.js"></script>

    <!-- this is the script where all your game's JS goes -->
    <script src="mygame.js"></script>

    <script>
      window.addEventListener('load', Game.start);
    </script>

    <style type="text/css">
      /* remove the small gap at the top */
      body { margin-top: 0 }

      /* horizontally center your stage on the page */
      #cr-stage { margin: 0 auto 0 }
    </style>
  </head>
  <body>
  </body>
</html>
于 2013-05-28T20:36:18.533 に答える