[Unity]ビルドしたWebGLをクリック後の読み込みに変更する方法
unityでwebGLをビルドすると自動的にファイルが読み込まれるのですが、読み込みをクリック後にされるように変更したいと思います。
※Unity:Webに埋め込んだWebGLをクリックしてからロードするのコードをだいぶ引用させていただきました(汗
unityでビルドした際にindex.htmlが作成されるのですが、その中の記述で以下の部分
var gameInstance = UnityLoader.instantiate("gameContainer", "Build/Datugokusoshi.json", {onProgress: UnityProgress});
この部分を以下のように変更
var gameInstance; function loadWebgl() { gameInstance = UnityLoader.instantiate("gameContainer", "Build/Datugokusoshi.json", {onProgress: UnityProgress}); }
「var gameInstance;」を関数の外で宣言しているのですが、引用元を拝見させていただいた結果、フルスクリーンで表示されないのは変数のスコープの問題かもしれまい。(勘で言ってます^^;)
ということで、関数の外で宣言し、loadWebglを呼び出すためにjavascriptでクリックしたら、loadWebglを呼び出すようにします。
<div id="gameContainer" style="width: 800px; height: 450px;"><div style="width: 800px; height: 450px; background: #eeeeee;" onclick="loadWebgl();">クリックしてチョンマゲ</div></div>
しかし、ここで問題発生(涙
webglを呼び出す前にフルスクリーンボタンを押すとエラーが出る、、、
と、いうことで、jquery様のチカラをお借りすることにしました
head内でまずjqueryを読み込みます。※ダウンロードして直接サーバにアップすることもできます。
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
一旦フルスクリーンボタンを見た目上消します。
<div style="display: none;" class="fullscreen" onclick="gameInstance.SetFullscreen(1)"></div>
次に以下のようにコード変更します。
var gameInstance; function loadWebgl() { $(".fullscreen").show(); gameInstance = UnityLoader.instantiate("gameContainer", "Build/Datugokusoshi.json", {onProgress: UnityProgress}); }
「$(“.fullscreen”).show();」で消したフルスクリーンボタンが復活します。
– サンプル –