66

プレーヤーがさまざまな既存のゲームに参加できる Three.js を使用して、3D マルチプレーヤー ゲームを作成しています。「再生」をクリックすると、レンダラーがページとフルスクリーンに追加されます。これはうまく機能しますが、問題は、フルスクリーンを終了しても追加されたままになることです。削除したいのですが、いつになるかわかりません。

つまり、基本的には、「この要素が全画面表示を終了しました」というイベントを探しています。

これは、レンダラーをページに追加する方法です。

container = document.getElementById('container');
document.body.appendChild(container);

var renderer = new THREE.WebGLRenderer({antialias: true});
renderer.setSize( WIDTH, HEIGHT);
container.appendChild( renderer.domElement );

これを全画面表示する方法は次のとおりです。

THREEx.FullScreen.request(container); 
renderer.setSize(screen.width, screen.height);

また、誰かがマウスをページの上部に向けたときに、迷惑なヘッダーが表示されないようにする方法はありますか? そして、Firefox と Chrome でpreventDefault?

編集：

「fullscreenchange」イベントは実際に発生しますが、ブラウザによって名前が異なります。たとえば、Chrome では「webkitfullscreenchange」と呼ばれ、Firefox では「mozfullscreenchange」と呼ばれます。

4

7 に答える 7

48

Fullscreen 仕様"fullscreenchange"では、ページのフルスクリーン状態 (フルスクリーンへの出入りを含む) が変更されるたびに、(適切なプレフィックスを使用して) イベントがドキュメントで発生することが指定されています。そのイベント内でdocument.fullScreenElement、ページがフルスクリーンかどうかを確認できます。フルスクリーンの場合、プロパティは null 以外になります。

詳細については、 MDNを参照してください。

他の質問について: いいえ、Escフルスクリーンを終了するのを防ぐ方法はありません。これは、ユーザーがブラウザーの動作を常に制御できるようにするために行われた妥協です。ブラウザは、ユーザーが全画面表示を終了するのを防ぐ方法を決して提供しません。限目。

Firefox のレンダリングが Chrome より遅いことについては、ほとんどの実用的な目的ではそうではないことを保証できます。2 つのブラウザーのパフォーマンスに大きな違いがある場合は、GPU ではなく、JavaScript コードがボトルネックになっている可能性があります。

于 2012-05-22T17:34:24.247 に答える