我们如何可以通过编程进入和退出JavaScript中的全屏模式？ [英] How can we programmatically enter and exit the fullscreen mode in javascript?

问题描述

这里有一个关于退出全屏模式文档。

我用这个code，我learnd让浏览器去全屏（它的工作），但我试图修改版本的它退出全屏失败。这些不规范的API打交道是有点棘手，每个浏览器实现它有点不同。

I used this code that I learnd to make the browser go fullscreen (it works), but my attempts to modify a version of it to exit fullscreen failed. Dealing with these non-standard APIs is a little tricky, with each browser implementing it a bit differently.

这里的code：

// Bring the page into full-screen mode - Works!
function requestFullScreen(element) {

    // Supports most browsers and their versions.
    var requestMethod = element.requestFullScreen || 
        element.webkitRequestFullScreen           || 
        element.mozRequestFullScreen              || 
        element.msRequestFullScreen;
    if (requestMethod) {
        requestMethod.call(element);
    } else if ( typeof window.ActiveXObject !== "undefined") {
        var wscript = new ActiveXObject("WScript.Shell");
        if (wscript !== null) {
            wscript.SendKeys("{F11}");
        }
    }
}

// Exit fullscreen - Doesn't work!
function exitFullScreen(element){
    var requestMethod = element.exitFullscreen || 
        element.mozCancelFullScreen            || 
        element.webkitExitFullscreen           || 
        element.msExitFullscreen;
    if (requestMethod) {
        requestMethod();
    } else {
        console.log("Oops. Request method false.");
    }
}

和调用：

var $fullscreenButton = $("#fullscreen-button");
var $smallscreenButton = $("#smallscreen-button");

$fullscreenButton.on("click", function() {
    var elem = document.body;

    // Make the body go full screen.
    requestFullScreen(elem);
});

$smallscreenButton.on("click", function() {
    var elem = document.body;

    // Exit full screen.
    exitFullScreen(elem);
});

什么是错的exitFullScreen功能？我怎样才能解决这个问题？

What's wrong with the exitFullScreen function? How can I fix it?

编辑：

• 我工作的一个的jsfiddle这个！


• 将无效，我的意思是它输出哎呀，请求方法假的。


• 我打电话的功能 exitFullScreen（）通过参数 document.body的

• I'm working on a JSFiddle for this!
• By "Doesn't work", I meant that it outputs "Oops. Request method false."
• I'm calling the function exitFullScreen() with the parameter document.body

的jsfiddle：

虽然全屏请求函数工作对我来说在浏览器中正常，我无法得到它在的jsfiddle ，我不确定这是否是因为我自己的错误，或者是与的jsfiddle的。

While the full screen request function works for me in the browser normally, I could not get it to work in JSFiddle, and I'm unsure whether this is because of my own mistake, or something to do with JSFiddle.

推荐答案

有关进入全屏有一些问题与资本化。

For entering the fullscreen there were some issues with the capitalization.

有关的退出，你需要调用它的文件并没有对体，并且还需要正确地运用它，而不是调用参考方法。

For the exiting you need to call it on the document and not on the body, and you also need to apply it correctly instead of calling the reference to the method..

所以 requestMethod.call（元素）; 用于退出以及

请参阅演示在 http://jsfiddle.net/gaby/FGX72/show 结果
（上测试最新的IE / Chrome浏览器/火狐的）

这篇关于我们如何可以通过编程进入和退出JavaScript中的全屏模式？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！