Chrome Fullscreen API

Question

Согласно этой статье Google Chrome 15 имеет полноэкранный JavaScript API.

Я пытался заставить его работать, но не получилось. Я также тщетно искал официальную документацию.

Как выглядит полноэкранный JavaScript API?

Answer 1

API работает только во время взаимодействия с пользователем, поэтому его нельзя использовать злонамеренно.Попробуйте следующий код:

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

    rfs.call(el);
});

Answer 2

Я сделал простую оболочку для полноэкранного API, которая называется screenfull.js , чтобы сгладить беспорядок префиксов и устранить некоторые несоответствия в различных реализациях. Посмотрите демоверсию , чтобы увидеть, как работает полноэкранный API.

Рекомендуемое чтение:

• Использование полноэкранного API в веб-браузерах
• MDN - полноэкранный API

Answer 3

Вот некоторые функции, которые я создал для работы с полноэкранным режимом в браузере.

Они обеспечивают вход / выход в полноэкранном режиме в большинстве основных браузеров.

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);
}

Answer 4

Следующий тест работает в Chrome 16 (ветка разработчика) на X86 и Chrome 15 на Mac OSX Lion

http://html5 -demos.appspot.com / статический / fullscreen.html

Answer 5

В проекте библиотеки закрытия Google есть модуль, который выполняет эту работу, ниже - API и исходный код.

Закрытие библиотеки fullscreen.js API

Закрытие libray fullscreen.js Код