web-dev-qa-db-ja.com

Chrome= Fullscreen API

この記事 Google Chrome 15にはフルスクリーンJavaScript APIがあります。

私はそれを機能させようとしましたが、失敗しました。公式のドキュメントも検索しましたが、無駄です。

フルスクリーンJavaScript APIはどのように見えますか？

javascriptgoogle-chromefullscreen
68
Randomblue

APIはユーザーの操作中にのみ機能するため、悪意を持って使用することはできません。次のコードを試してください：

addEventListener("click", function() {
    var el = document.documentElement,
      rfs = el.requestFullscreen
        || el.webkitRequestFullScreen
        || el.mozRequestFullScreen
        || el.msRequestFullscreen 
    ;

    rfs.call(el);
});
141
Eli Grey

screenfull.js と呼ばれるFullscreen APIの単純なラッパーを作成して、プレフィックスの混乱を解消し、さまざまな実装の不整合を修正しました。 demo をチェックして、Fullscreen APIの動作を確認してください。

推奨読書：

32
Sindre Sorhus

以下は、ブラウザでフルスクリーンを操作するために作成したいくつかの関数です。

これらは、ほとんどの主要なブラウザで入力/終了フルスクリーンの両方を提供します。

function isFullScreen()
{
    return (document.fullScreenElement && document.fullScreenElement !== null)
         || document.mozFullScreen
         || document.webkitIsFullScreen;
}


function requestFullScreen(element)
{
    if (element.requestFullscreen)
        element.requestFullscreen();
    else if (element.msRequestFullscreen)
        element.msRequestFullscreen();
    else if (element.mozRequestFullScreen)
        element.mozRequestFullScreen();
    else if (element.webkitRequestFullscreen)
        element.webkitRequestFullscreen();
}

function exitFullScreen()
{
    if (document.exitFullscreen)
        document.exitFullscreen();
    else if (document.msExitFullscreen)
        document.msExitFullscreen();
    else if (document.mozCancelFullScreen)
        document.mozCancelFullScreen();
    else if (document.webkitExitFullscreen)
        document.webkitExitFullscreen();
}

function toggleFullScreen(element)
{
    if (isFullScreen())
        exitFullScreen();
    else
        requestFullScreen(element || document.documentElement);
}
14
Drew Noakes

次のテストは、X86ではChrome 16（devブランチ）、Mac OSX LionではChrome 15で動作します

http://html5-demos.appspot.com/static/fullscreen.html

6
Mo Kargas

Googleのクロージャーライブラリプロジェクトには、仕事をするモジュールがあります。以下はAPIとソースコードです。

クロージャーライブラリfullscreen.js API

Closure libray fullscreen.js Code

0
monjer