0

私はhtml5ゲームを作っています。複数のキャンバスを使用します。

<div id="GameContainer" >
<canvas id="MapCanvas" width="1200" height="690" style=" position:absolute;z-index: 1s; ">
Your browser does not support the canvas element.
</canvas>
<canvas id="CellHighLightCanvas"width="1200" height="690" style=" position:absolute;z-index: 2;">
Your browser does not support the canvas element.
</canvas>

<canvas id="UnderUnitCanvas" width="1200" height="690" style="position:absolute;  z-index: 3;">
Your browser does not support the canvas element.
</canvas>

フルスクリーンにしてみました。私はこの方法を使用しました：

if (element.requestFullScreen)
            element.requestFullScreen();
        else if (element.webkitRequestFullScreen)
            element.webkitRequestFullScreen();
        else if (element.mozRequestFullScreen)
            element.mozRequestFullScreen();

要素はそれぞれキャンバスからのものです（このコードはループ内にあります）。しかし、それは1つのキャンバスに対してのみ機能します。すべてのキャンバスでこれを行うにはどうすればよいですか?

4

1 に答える 1

1

一度に複数の要素を全画面表示にすることはできません。親 div を使用します。

var element = document.getElementById("GameContainer");

if (element.requestFullScreen)
  element.requestFullScreen();
else if (element.webkitRequestFullScreen)
  element.webkitRequestFullScreen();
else if (element.mozRequestFullScreen)
  element.mozRequestFullScreen();
于 2013-09-29T10:26:15.080 に答える